/*
Theme Name: Foreningen FISKEN
Theme URI: https://fisken.org
Author: Foreningen FISKEN
Description: Officielt tema for Foreningen FISKEN – hjælper unge 13-24 år.
Version: 1.0
License: GNU General Public License v2 or later
Text Domain: fisken
*/

/* ============================================================
   FISKEN DESIGN SYSTEM — DELTE STYLES
   ============================================================ */
:root{
  --ink:#0E353D;
  --blue:#007A8D;
  --blue-deep:#00606E;
  --lblue:#B8D4DD;
  --coral:#EC605E;
  --yellow:#FFF7C9;
  --cream:#FBF8F1;
  --white:#FFFFFF;
  --grey:#51616B;
  --tint-teal:rgba(0,122,141,.10);
  --tint-coral:rgba(255,106,77,.14);
  --tint-lblue:rgba(184,212,221,.45);
  --radius:28px;
  --shadow:0 18px 50px -22px rgba(14,53,61,.45);
  --maxw:1180px;
  --nav-h:128px;
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:var(--nav-h)}
body{
  font-family:'Hanken Grotesk',sans-serif;
  color:var(--ink);
  background:var(--cream);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
h1,h2,h3,h4{font-family:'Bricolage Grotesque',sans-serif;line-height:1.05;letter-spacing:-.02em}
a{color:inherit;text-decoration:none}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}
section{position:relative}
svg{display:block}

/* ---------- BUTTONS ---------- */
.btn{
  display:inline-flex;align-items:center;gap:.5em;
  font-family:'Hanken Grotesk';font-weight:700;font-size:1rem;
  padding:.85em 1.5em;border-radius:999px;cursor:pointer;border:none;
  transition:transform .25s cubic-bezier(.3,1.4,.5,1),box-shadow .25s,background .2s;
  white-space:nowrap;
}
.btn:hover{transform:translateY(-3px)}
.btn-blue{background:var(--blue);color:#fff;box-shadow:0 10px 24px -10px var(--blue)}
.btn-blue:hover{box-shadow:0 16px 30px -12px var(--blue)}
.btn-coral{background:var(--coral);color:#fff;box-shadow:0 10px 24px -10px var(--coral)}
.btn-coral:hover{box-shadow:0 16px 30px -12px var(--coral)}
.btn-ghost{background:transparent;color:var(--ink);border:2px solid rgba(14,53,61,.18)}
.btn-ghost:hover{border-color:var(--ink);background:var(--ink);color:#fff}
.btn-white{background:#fff;color:var(--blue)}

/* ---------- NAV ---------- */
header{
  position:fixed;top:0;left:0;right:0;z-index:100;height:var(--nav-h);
  display:flex;align-items:center;
  background:#B8D4DD;
  transition:background .3s,box-shadow .3s,backdrop-filter .3s;
}
header.scrolled{backdrop-filter:blur(14px);box-shadow:0 4px 24px -16px rgba(14,53,61,.4)}
header .wrap{display:flex;align-items:center;justify-content:space-between;width:100%}
.logo{display:flex;align-items:center;gap:.6rem;font-family:'Bricolage Grotesque';font-weight:800;font-size:1.5rem;letter-spacing:-.03em;color:var(--ink)}
nav.desktop{display:flex;align-items:center;gap:.35rem}
nav.desktop a{
  font-weight:600;font-size:.97rem;padding:.5em .85em;border-radius:999px;color:var(--ink);
  transition:background .2s,color .2s;position:relative;
}
nav.desktop a:hover{background:var(--tint-teal);color:var(--blue)}
nav.desktop a.active{color:var(--blue)}
nav.desktop a.active::after{
  content:"";position:absolute;left:50%;bottom:2px;transform:translateX(-50%);
  width:6px;height:6px;border-radius:50%;background:var(--coral);
}
/* dropdown */
.nav-dropdown{position:relative}
.nav-dropdown .nav-dropdown-menu{
  position:absolute;top:100%;left:50%;transform:translateX(-50%) translateY(-6px);
  border-top:10px solid transparent;background:#fff;background-clip:padding-box;
  border-radius:14px;box-shadow:0 12px 32px -10px rgba(14,53,61,.25);
  padding:8px;min-width:220px;z-index:200;
  opacity:0;pointer-events:none;
  transition:opacity .35s ease,transform .35s ease;transition-delay:.3s;
}
.nav-dropdown:hover .nav-dropdown-menu{opacity:1;pointer-events:all;transform:translateX(-50%) translateY(0);transition-delay:0s}
.nav-dropdown-menu a{
  display:block;padding:.55em 1em;border-radius:10px;font-weight:600;font-size:.93rem;
  color:var(--ink);white-space:nowrap;transition:background .15s,color .15s;
}
.nav-dropdown-menu a:hover{background:var(--tint-teal);color:var(--blue)}
.nav-cta{margin-left:.5rem}
.burger{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:8px}
.burger span{width:26px;height:3px;background:var(--ink);border-radius:3px;transition:.3s}
.burger.open span:nth-child(1){transform:translateY(8px) rotate(45deg)}
.burger.open span:nth-child(2){opacity:0}
.burger.open span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}

.mobile-menu{
  position:fixed;inset:0;z-index:99;background:var(--cream);
  display:flex;flex-direction:column;justify-content:center;gap:.5rem;padding:0 32px;
  transform:translateY(-100%);transition:transform .45s cubic-bezier(.6,0,.2,1);
  overflow-y:auto;
}
.mobile-menu.open{transform:translateY(0)}
.mobile-menu a{font-family:'Bricolage Grotesque';font-weight:700;font-size:2rem;color:var(--ink);padding:.3em 0}
.mobile-menu a:active{color:var(--blue)}
.mobile-menu .btn{font-size:1.2rem;margin-top:1rem;align-self:flex-start}

/* ---------- LANGUAGE BUTTONS ---------- */
.lang-btn{font-family:'Hanken Grotesk',sans-serif;font-weight:700;font-size:.82rem;background:none;border:none;cursor:pointer;padding:.3em .55em;border-radius:6px;color:var(--ink);opacity:.4;transition:opacity .15s,background .15s}
.lang-btn:hover{opacity:.75}
.lang-btn.active{opacity:1;background:rgba(14,53,61,.1)}

/* ---------- REVEAL ---------- */
.reveal{opacity:0;transform:translateY(34px);transition:opacity .7s ease,transform .7s cubic-bezier(.3,1,.4,1)}
.reveal.in{opacity:1;transform:none}

/* ---------- SECTION HEADERS ---------- */
.sec-head{max-width:640px;margin-bottom:3rem;margin-left:auto;margin-right:auto}
.sec-tag{font-weight:700;text-transform:uppercase;letter-spacing:.1em;font-size:.85rem;color:var(--coral);margin-bottom:.6rem;display:block}
.sec-head h2{font-size:clamp(2rem,4.5vw,3.4rem);font-weight:800}
.sec-head p{color:var(--grey);font-size:1.15rem;margin-top:1rem}
.center{margin-left:auto;margin-right:auto;text-align:center}

/* ---------- CARDS (tilbud) ---------- */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.card{
  border-radius:var(--radius);padding:34px 30px;position:relative;overflow:hidden;
  border:1px solid rgba(14,53,61,.05);transition:transform .3s,box-shadow .3s;
  color:var(--white);display:block;cursor:pointer;
}
.card:nth-child(odd){background:var(--blue)}
.card:nth-child(even){background:var(--blue-deep)}
.card:hover{transform:translateY(-8px);box-shadow:var(--shadow)}
.card .icon{display:none}
.card .age{font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:rgba(255,255,255,.75);background:rgba(255,255,255,.15);padding:.3em .8em;border-radius:999px;display:inline-block;margin-bottom:.8rem}
.card h3{font-size:1.35rem;font-weight:700;margin-bottom:.5rem;color:#fff}
.card p{color:rgba(255,255,255,.85);font-size:.97rem}
.card .more{margin-top:1.1rem;font-weight:700;color:rgba(255,255,255,.9);display:inline-flex;align-items:center;gap:.3em;transition:gap .2s}
.card:hover .more{gap:.7em}
.card-img{width:100%;height:180px;object-fit:cover;border-radius:18px 18px 0 0;margin:-34px -30px 20px -30px;width:calc(100% + 60px)}

/* ---------- BAND ---------- */
.band{background:var(--blue);color:#fff;padding:64px 0}
.band-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;text-align:center}
.band-item .big{font-family:'Bricolage Grotesque';font-weight:800;font-size:clamp(2rem,4vw,3rem);line-height:1}
.band-item .small{font-size:1rem;color:rgba(255,255,255,.82);margin-top:.4rem}

/* ---------- VÆR MED / VM ---------- */
.vm-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.vm{
  border-radius:var(--radius);padding:40px 34px;color:#fff;position:relative;overflow:hidden;
  min-height:280px;display:flex;flex-direction:column;justify-content:flex-end;
  transition:transform .3s;
}
.vm:hover{transform:translateY(-8px)}
.vm.v1{background:linear-gradient(150deg,var(--coral),#EC605E)}
.vm.v2{background:linear-gradient(150deg,var(--blue),var(--blue-deep))}
.vm.v3{background:linear-gradient(150deg,var(--ink),#1c4e57)}
.vm .vm-ic{position:absolute;top:24px;right:28px;color:rgba(255,255,255,.92)}
.vm .vm-ic svg{width:40px;height:40px;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;fill:none}
.vm h3{font-size:1.6rem;margin-bottom:.5rem}
.vm p{color:rgba(255,255,255,.85);margin-bottom:1.4rem}
.vm .btn{align-self:flex-start}

/* ---------- LOGO TICKER ---------- */
.logo-ticker{overflow:hidden;margin-top:1rem;-webkit-mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.logo-track{display:flex;gap:80px;width:max-content;will-change:transform;align-items:center}
.logo-item{flex:0 0 auto;height:110px;width:200px;display:flex;align-items:center;justify-content:center}
.logo-item img{height:90px;width:180px;object-fit:contain;filter:grayscale(100%) opacity(.6);transition:filter .3s}
.logo-ticker:hover .logo-item img{filter:grayscale(0%) opacity(1)}

/* ---------- QUOTES ---------- */
.quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.quote{
  background:#fff;border-radius:var(--radius);padding:34px;position:relative;
  border:1px solid rgba(14,53,61,.05);box-shadow:0 14px 36px -26px rgba(14,53,61,.5);
}
.quote .mark{font-family:'Bricolage Grotesque';font-size:4rem;color:var(--coral);line-height:.6;height:.5em}
.quote p{font-size:1rem;color:var(--ink);margin:1rem 0 1.4rem}
.quote .who{font-weight:700;color:var(--blue)}
.quote .who small{display:block;font-weight:500;color:var(--grey);font-size:.85rem}

/* ---------- KONTAKT FORMULAR ---------- */
.kontakt{padding:90px 0 110px;background:#fff;border-radius:48px;margin-top:0}
.kontakt-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:stretch}
.kontakt-right-col{display:flex;flex-direction:column}
.kontakt-right-col .kontakt-box{flex:1;display:flex;flex-direction:column}
.kontakt-left-head{text-align:center;margin-bottom:1.4rem}
.kontakt-left-head h3{font-size:1.5rem;font-weight:800;color:var(--ink)}
.kontakt-left-head p{color:var(--grey);font-size:1rem;margin-top:.3rem}
.kontakt-form{display:flex;flex-direction:column;gap:20px}
.kontakt-form input,.kontakt-form select,.kontakt-form textarea,
.wpcf7-form input[type="text"],.wpcf7-form input[type="email"],.wpcf7-form input[type="tel"],
.wpcf7-form select,.wpcf7-form textarea{
  width:100%;padding:14px 18px;border-radius:14px;border:1.5px solid rgba(14,53,61,.14);
  font-family:'Hanken Grotesk',sans-serif;font-size:1rem;color:var(--ink);background:#B8D4DD;
  outline:none;transition:border-color .2s;resize:none;
}
.wpcf7-form input[type="text"]:focus,.wpcf7-form input[type="email"]:focus,
.wpcf7-form input[type="tel"]:focus,.wpcf7-form textarea:focus{border-color:var(--blue)}
.wpcf7-form textarea{min-height:180px}
.wpcf7-form .wpcf7-submit,.kontakt-form button[type="submit"]{
  display:inline-flex;align-items:center;justify-content:center;gap:.5em;
  font-family:'Hanken Grotesk';font-weight:700;font-size:1rem;
  padding:.85em 1.5em;border-radius:999px;cursor:pointer;border:none;
  background:var(--blue);color:#fff;box-shadow:0 10px 24px -10px var(--blue);
  transition:transform .25s cubic-bezier(.3,1.4,.5,1),box-shadow .25s;
  white-space:nowrap;width:100%;
}
.wpcf7-form{display:flex;flex-direction:column;gap:16px}
.wpcf7-form p{margin:0}
.kontakt-right-head{margin-bottom:1.4rem;text-align:center}
.kontakt-right-head h3{font-size:1.5rem;font-weight:800;color:var(--ink)}
.kontakt-box{background:#B8D4DD;border-radius:var(--radius);padding:28px;border:1px solid rgba(14,53,61,.07)}
.kontakt-info{display:flex;flex-direction:column;gap:6px;margin-bottom:20px}
.kontakt-info p{color:var(--grey);font-size:1rem;line-height:1.7}
.kontakt-info a{color:var(--blue);font-weight:600}
.kontakt-map{width:100%;height:340px;border-radius:16px;border:none;margin-top:16px}

/* ---------- INSTAGRAM (Smash Balloon) ---------- */
.instagram-section{padding:90px 0;background:var(--white)}
.insta-feed-wrap{position:relative;background:var(--cream);border-radius:var(--radius);padding:20px;box-shadow:0 14px 36px -26px rgba(14,53,61,.3);min-height:280px}
.insta-corner-btn{position:absolute;top:14px;right:14px;z-index:5;display:inline-flex;align-items:center;gap:.4em;background:var(--coral);color:#fff;font-weight:700;font-size:.85rem;padding:.55em 1.1em;border-radius:999px;box-shadow:0 8px 20px -8px var(--coral);transition:transform .2s,box-shadow .2s}
.insta-corner-btn:hover{transform:translateY(-2px);box-shadow:0 12px 26px -8px var(--coral)}
#sbi_load .sbi_load_btn{display:none!important}
#sbi_load .sbi_follow_btn{display:none!important}

/* ---------- SPLIT SECTION (image + text) ---------- */
.split-grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.split-img{border-radius:24px;width:100%;aspect-ratio:4/3;object-fit:cover;box-shadow:0 24px 60px -20px rgba(14,53,61,.22)}
.split-text .sec-tag{margin-bottom:.5rem}
.split-text h2{font-size:clamp(1.7rem,3vw,2.4rem);font-weight:800;margin-bottom:1rem}
.split-text p{color:var(--grey);line-height:1.75;margin-bottom:.8rem}
.split-text ul{color:var(--grey);line-height:1.75;padding-left:1.2rem;margin-bottom:1rem}
.split-text ul li{margin-bottom:.35rem}
@media(max-width:820px){.split-grid{grid-template-columns:1fr;gap:32px}.split-img{max-width:480px}}

/* ---------- INFO CARDS (processen) ---------- */
.info-cards-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.info-card{background:#fff;border-radius:20px;padding:28px 24px;border:1px solid rgba(14,53,61,.06);box-shadow:0 8px 24px -16px rgba(14,53,61,.2)}
.info-card .icon{display:block;font-size:2rem;margin-bottom:.8rem;line-height:1;color:var(--blue)}
.info-card h3{font-size:1.05rem;font-weight:700;margin-bottom:.5rem}
.info-card p{font-size:.9rem;color:var(--grey);line-height:1.65}
@media(max-width:700px){.info-cards-grid{grid-template-columns:1fr}}

/* ---------- ANDRE TILBUD ---------- */
.andre-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.andre-card{background:#fff;border-radius:16px;padding:24px;display:block;text-decoration:none;color:var(--ink);transition:transform .2s,box-shadow .2s}
.andre-card:hover{transform:translateY(-3px);box-shadow:0 12px 30px -10px rgba(14,53,61,.3)}
.andre-card h3{font-size:1rem;font-weight:700;margin-bottom:.4rem}
.andre-card p{font-size:.88rem;color:var(--grey);line-height:1.6;margin-bottom:.8rem}
.andre-card .link{font-size:.88rem;color:var(--blue);font-weight:600}
@media(max-width:700px){.andre-grid{grid-template-columns:1fr}}

/* ---------- FOOTER ---------- */
footer{background:var(--ink);color:#fff;padding:70px 0 36px}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px;margin-bottom:46px}
.foot-grid h4{font-size:.9rem;text-transform:uppercase;letter-spacing:.08em;color:var(--yellow);margin-bottom:1.2rem}
.foot-grid a{display:block;color:rgba(255,255,255,.78);padding:.32em 0;font-size:.97rem;transition:color .2s,padding-left .2s}
.foot-grid a:hover{color:#fff;padding-left:6px}
.foot-brand .logo{color:#fff;margin-bottom:1rem}
.foot-brand p{color:rgba(255,255,255,.62);font-size:.95rem;max-width:30ch}
.socials{display:flex;gap:12px;margin-top:1.2rem}
.socials a{width:42px;height:42px;border-radius:12px;background:rgba(255,255,255,.1);display:grid;place-items:center;color:#fff;transition:background .2s,transform .2s}
.socials a svg{width:18px;height:18px}
.socials a:hover{background:var(--blue);transform:translateY(-3px)}
.foot-bottom{border-top:1px solid rgba(255,255,255,.12);padding-top:24px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;color:rgba(255,255,255,.55);font-size:.88rem}

/* ---------- PAGE HERO (subpages) ---------- */
.page-hero{padding:calc(var(--nav-h) + 80px) 0 60px;background:var(--lblue)}
.page-hero h1{font-size:clamp(2.2rem,5vw,3.8rem);font-weight:800;margin-bottom:.5rem}
.page-hero p.lead{font-size:1.2rem;color:var(--grey);max-width:52ch;margin-top:.6rem}

/* ---------- EYEBROW ---------- */
.eyebrow{
  display:inline-flex;align-items:center;gap:.5em;background:#fff;border:1px solid rgba(14,53,61,.08);
  padding:.5em 1em;border-radius:999px;font-weight:700;font-size:.85rem;
  text-transform:uppercase;letter-spacing:.04em;color:var(--blue);box-shadow:var(--shadow);
}
.eyebrow .dot{width:9px;height:9px;border-radius:50%;background:var(--coral);animation:pulse 2s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.3}}

/* ---------- MISSION ---------- */
.mission{padding:40px 0}
.mission-card{
  background:var(--ink);color:#fff;border-radius:var(--radius);padding:14px 48px;position:relative;overflow:hidden;
  box-shadow:var(--shadow);display:grid;grid-template-columns:1fr auto;gap:60px;align-items:center;
}
.mission-card h2{font-size:clamp(1.8rem,3.5vw,2.8rem);font-weight:800;margin-bottom:1rem}
.mission-card p{color:rgba(255,255,255,.82);font-size:1.1rem;max-width:52ch}
.mission-card .word{color:var(--yellow);font-weight:700}
.mission-card .corner{position:absolute;width:300px;height:300px;border-radius:50%;background:var(--blue);opacity:.15;bottom:-100px;right:280px}
.mission-card .corner2{position:absolute;width:180px;height:180px;border-radius:50%;background:var(--coral);opacity:.12;top:-60px;left:-40px}
.mission-logo-wrap{flex:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;position:relative;z-index:1;padding:20px 40px}
.mission-logo-wrap img{width:260px;height:auto;filter:brightness(0) invert(1)}
.mission-logo-wrap span{font-size:.8rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:rgba(255,255,255,.5)}

/* ---------- BLOBS & ANIMATIONS ---------- */
.blob{position:absolute;border-radius:48% 52% 60% 40%/55% 45% 55% 45%;z-index:1;filter:blur(.5px);opacity:.5}
.blob.b1{width:340px;height:340px;background:radial-gradient(circle at 30% 30%,#d6e6eb,var(--lblue));top:-40px;right:-80px;animation:float 9s ease-in-out infinite}
@keyframes float{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-28px) rotate(8deg)}}
.fish{position:absolute;z-index:1;opacity:.6;animation:swimfish linear infinite}
.fish svg{display:block;transform:scaleX(-1)}
.fish.f1{width:220px;top:20%;left:-250px;animation-duration:18s;animation-delay:0s}
.fish.f2{width:160px;top:55%;left:-200px;animation-duration:24s;animation-delay:-9s}
.fish.f3{width:190px;top:72%;left:-220px;animation-duration:21s;animation-delay:-15s}
@keyframes swimfish{
  0%{transform:translateX(0) translateY(0) rotate(0deg)}
  20%{transform:translateX(20vw) translateY(-40px) rotate(4deg)}
  40%{transform:translateX(42vw) translateY(15px) rotate(-4deg)}
  60%{transform:translateX(62vw) translateY(-35px) rotate(3deg)}
  80%{transform:translateX(85vw) translateY(20px) rotate(-3deg)}
  100%{transform:translateX(115vw) translateY(0) rotate(0deg)}
}

/* ---------- CTA BOX ---------- */
.cta-box{background:var(--blue);color:#fff;border-radius:var(--radius);padding:40px 44px;display:flex;align-items:center;justify-content:space-between;gap:28px;flex-wrap:wrap;margin:50px 0}
.cta-box h3{font-size:1.6rem;margin-bottom:.4rem}
.cta-box p{color:rgba(255,255,255,.82);max-width:44ch}

/* ---------- ACCORDION (privatlivspolitik) ---------- */
.accordion-item{border-bottom:1px solid rgba(14,53,61,.1);overflow:hidden}
.accordion-btn{width:100%;display:flex;align-items:center;justify-content:space-between;gap:16px;background:none;border:none;cursor:pointer;padding:20px 0;text-align:left;font-family:'Hanken Grotesk',sans-serif;font-size:1rem;font-weight:600;color:var(--ink)}
.accordion-btn .acc-icon{width:28px;height:28px;border-radius:50%;background:var(--tint-teal);color:var(--blue);display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:1.2rem;line-height:1;transition:transform .3s,background .3s,color .3s}
.accordion-btn[aria-expanded="true"] .acc-icon{transform:rotate(135deg);background:var(--coral);color:#fff}
.accordion-body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .35s ease}
.accordion-body.open{grid-template-rows:1fr}
.accordion-inner{overflow:hidden;padding-bottom:20px;color:var(--grey);line-height:1.7;font-size:.97rem}
.accordion-inner p{margin-bottom:.8rem}
.accordion-inner ul{padding-left:1.4rem;margin:.5rem 0}
.accordion-inner li{margin-bottom:.4rem}

/* ---------- TEAM GRID (find-en-fisk) ---------- */
.team-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin-top:2rem}

/* ---------- TEAM SMALL (tilbud pages) ---------- */
.team-sm-grid{display:flex;flex-wrap:wrap;gap:24px;justify-content:center;margin-top:2rem}
.team-sm-card{background:#fff;border-radius:18px;padding:24px 20px;text-align:center;border:1px solid rgba(14,53,61,.07);box-shadow:0 4px 20px -10px rgba(14,53,61,.22);width:220px;flex-shrink:0}
.team-card{background:#fff;border-radius:20px;overflow:hidden;text-align:left;border:1px solid rgba(14,53,61,.06);box-shadow:0 8px 24px -16px rgba(14,53,61,.3);transition:transform .2s,box-shadow .2s}
.team-card:hover{transform:translateY(-4px);box-shadow:0 14px 36px -16px rgba(14,53,61,.35)}
.team-card img{width:100%;aspect-ratio:1/1;object-fit:cover;object-position:top;display:block}
.team-card-body{padding:20px 22px}
.team-card h3{font-size:1.05rem;font-weight:700;margin-bottom:.2rem}
.team-card .role{font-size:.85rem;color:var(--blue);font-weight:600}
.team-card .area{font-size:.8rem;color:var(--grey);margin-top:.2rem}

/* ---------- RESPONSIVE ---------- */
@media(max-width:980px){
  .mission-card{grid-template-columns:1fr;gap:36px;padding:40px}
  .mission-logo-wrap img{width:130px}
  .kontakt-grid{grid-template-columns:1fr;gap:40px}
  .cards,.quotes,.vm-grid{grid-template-columns:1fr 1fr}
  .foot-grid{grid-template-columns:1fr 1fr;gap:32px}
}
@media(max-width:680px){
  nav.desktop,.nav-cta{display:none}
  .burger{display:flex}
  .cards,.quotes,.vm-grid,.band-grid,.foot-grid{grid-template-columns:1fr}
  .mission-card{padding:34px}
  .blob.b1{width:220px;height:220px;right:-60px}
  .team-grid{grid-template-columns:repeat(2,1fr)}
  .cta-box{flex-direction:column;text-align:center}
}
@media(max-width:400px){
  .team-grid{grid-template-columns:1fr}
}

/* ===== KALENDER (Ungerummet + Make My Friday) ===== */
.kalender-head{text-align:center;margin-bottom:2rem}
.kalender-month-nav{position:relative;display:flex;align-items:center;justify-content:center;gap:12px;margin-top:1.4rem;flex-wrap:wrap}
.kalender-month-nav .ke-today-btn{position:absolute;right:0;top:50%;transform:translateY(-50%)}
.kalender-month-label{font-family:'Bricolage Grotesque',sans-serif;font-size:1.1rem;font-weight:700;min-width:200px;text-align:center}
.ke-nav-circle{width:36px;height:36px;border-radius:50%;border:2px solid var(--lblue);background:#fff;font-size:1.1rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s,border-color .15s;flex-shrink:0}
.ke-nav-circle:hover{background:var(--lblue)}
.ke-nav-circle.ke-disabled{opacity:.35;cursor:default;pointer-events:none}
.ke-today-btn{background:var(--cream);border:2px solid var(--lblue);border-radius:999px;padding:.35em 1.1em;font-size:.9rem;font-weight:700;cursor:pointer;transition:background .15s}
.ke-today-btn:hover{background:var(--lblue)}

/* Week grid */
.kalender-week-wrap{overflow-x:auto;overflow-y:hidden;border-radius:var(--radius);box-shadow:0 4px 24px -8px rgba(14,53,61,.12);background:#fff;margin-top:1.5rem}
.kalender-week-scroll{min-width:600px;overflow:hidden}
.kalender-week-grid{display:grid;grid-template-columns:52px repeat(5,1fr)}
.ke-corner{background:#fafafa;border-bottom:2px solid var(--lblue);border-right:1px solid rgba(14,53,61,.07)}
.ke-day-head{background:#fafafa;border-bottom:2px solid var(--lblue);border-right:1px solid rgba(14,53,61,.07);padding:12px 4px;text-align:center}
.ke-day-head .dow{font-size:.75rem;font-weight:700;letter-spacing:.08em;color:var(--blue);text-transform:uppercase}
.ke-day-head .dom{font-size:1.4rem;font-weight:800;line-height:1.1;margin-top:2px}
.ke-day-head.is-today .dom{background:var(--coral);color:#fff;width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:2px auto 0}
.ke-time-col{position:relative;border-right:1px solid rgba(14,53,61,.07);background:#fafafa}
.ke-time-label{position:absolute;right:6px;font-size:.72rem;color:var(--grey);transform:translateY(-50%);white-space:nowrap}
.ke-day-col{position:relative;border-right:1px solid rgba(14,53,61,.07)}
.ke-day-col::before{content:'';position:absolute;inset:0;background:repeating-linear-gradient(to bottom,transparent,transparent 55px,rgba(14,53,61,.05) 55px,rgba(14,53,61,.05) 56px)}

/* Events */
.ke-event{position:absolute;left:3px;right:3px;border-radius:6px;padding:4px 6px;cursor:pointer;overflow:hidden;display:flex;flex-direction:column;gap:1px;transition:filter .15s}
.ke-event:hover{filter:brightness(.9)}
.ke-ev-title{font-size:.78rem;font-weight:700;line-height:1.2;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.ke-ev-time{font-size:.7rem;opacity:.8}

/* Legacy popup (ke-popup) */
#ke-popup{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center}
.ke-popup-backdrop{position:absolute;inset:0;background:rgba(14,53,61,.45);backdrop-filter:blur(3px)}
.ke-popup-box{position:relative;z-index:1;background:#fff;border-radius:20px;padding:24px;width:min(420px,90vw);box-shadow:0 24px 60px rgba(14,53,61,.3)}
.ke-popup-close{position:absolute;top:14px;right:14px;background:none;border:none;font-size:1rem;cursor:pointer;color:var(--grey);padding:4px 8px}

/* Ny modal (ke-modal) */
.ke-modal-overlay{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;background:rgba(14,53,61,.55);backdrop-filter:blur(4px);opacity:0;pointer-events:none;transition:opacity .25s}
.ke-modal-overlay.open{opacity:1;pointer-events:all}
.ke-modal-box{position:relative;background:#fff;border-radius:28px;padding:40px;width:min(540px,92vw);max-height:90vh;overflow-y:auto;box-shadow:0 24px 60px rgba(14,53,61,.3)}
.ke-modal-close{position:absolute;top:16px;right:16px;background:var(--cream);border:none;border-radius:50%;width:32px;height:32px;font-size:1rem;cursor:pointer;color:var(--grey);display:flex;align-items:center;justify-content:center}
.ke-modal-close:hover{background:var(--lblue)}
.ke-badge{display:inline-block;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--coral);margin-bottom:.6rem}
.ke-modal-box h3{font-size:1.5rem;font-weight:800;margin-bottom:.4rem}
.ke-meta{color:var(--blue);font-weight:600;font-size:.95rem;margin-bottom:.6rem}
.ke-pladser-info{background:var(--tint-teal);color:var(--blue);font-size:.82rem;font-weight:600;border-radius:999px;padding:.25em .8em;margin-bottom:.8rem}
.ke-actions{margin-top:1.2rem}
.ke-sub{color:var(--grey);font-size:.9rem;margin-bottom:1rem}
.ke-form{display:flex;flex-direction:column;gap:.7rem;margin-bottom:1.2rem}
.ke-form input,.ke-form textarea{border:1.5px solid rgba(14,53,61,.15);border-radius:10px;padding:.7em 1em;font-family:inherit;font-size:.95rem;background:var(--cream);transition:border-color .15s}
.ke-form input:focus,.ke-form textarea:focus{outline:none;border-color:var(--blue)}
.ke-form textarea{min-height:80px;resize:vertical}
.ke-phone-box{display:flex;align-items:center;gap:.8rem;background:var(--tint-teal);border-radius:14px;padding:14px 16px;margin-top:1rem}
.ke-phone-box a{font-weight:700;color:var(--blue)}
.ke-thanks-view{text-align:center;padding:1.5rem 0}
.ke-thanks-icon{width:56px;height:56px;border-radius:50%;background:var(--blue);color:#fff;font-size:1.6rem;display:flex;align-items:center;justify-content:center;margin:0 auto 1rem}
.ke-full-msg{background:var(--tint-coral);border-radius:12px;padding:14px 16px;color:var(--coral);font-weight:600;text-align:center;margin-top:1rem}

/* MMF Friday cards */
.mmf-days-row{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:1.5rem}
.mmf-day-card{background:#fff;border-radius:var(--radius);box-shadow:0 4px 24px -8px rgba(14,53,61,.12)}
.mmf-day-head{background:#fafafa;border-bottom:2px solid var(--lblue);padding:14px;text-align:center;border-radius:var(--radius) var(--radius) 0 0}
.mmf-day-head .dow{font-size:.75rem;font-weight:700;letter-spacing:.08em;color:var(--blue);text-transform:uppercase}
.mmf-day-head .dom{font-size:2rem;font-weight:800;line-height:1}
.mmf-day-head .moy{font-size:.8rem;font-weight:600;color:var(--grey);text-transform:uppercase;letter-spacing:.06em}
.mmf-timegrid{display:grid;grid-template-columns:42px 1fr;overflow:visible}
.mmf-time-col{position:relative;background:#fafafa;border-right:1px solid rgba(14,53,61,.07)}
.mmf-time-label{position:absolute;right:4px;font-size:.68rem;color:var(--grey);transform:translateY(-50%);white-space:nowrap}
/* Legacy class (old kalender.js) */
.mmf-event-col{position:relative}
.mmf-event-col::before{content:'';position:absolute;inset:0;background:repeating-linear-gradient(to bottom,transparent,transparent 55px,rgba(14,53,61,.05) 55px,rgba(14,53,61,.05) 56px)}
/* New class (current live kalender.js) */
.mmf-event-area{position:relative;overflow:visible}
.mmf-hour-line{position:absolute;left:0;right:0;border-top:1px solid rgba(14,53,61,.07);pointer-events:none}
/* Events — new class names used by live kalender.js */
.kalender-event{position:absolute;left:4px;right:4px;border-radius:8px;padding:5px 8px;cursor:pointer;overflow:hidden;display:flex;flex-direction:column;gap:2px;transition:filter .15s}
.kalender-event:hover{filter:brightness(.92)}
.kalender-event .ke-title{font-size:.78rem;font-weight:700;line-height:1.2;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.kalender-event .ke-time{font-size:.7rem;opacity:.82;line-height:1.2}
.kalender-event .ke-pladser-badge{font-size:.68rem;margin-top:2px;opacity:.85}
/* Color classes */
.kalender-event.c-ink{background:var(--ink);color:#fff}
.kalender-event.c-blue{background:var(--blue);color:#fff}
.kalender-event.c-coral{background:var(--coral);color:#fff}
.kalender-event.c-yellow{background:#FEF9C3;color:#713F12}
.kalender-event.c-pink{background:#F9A8D4;color:#831843}
.kalender-event.c-green{background:#BBF7D0;color:#14532D}
.kalender-event.c-lblue{background:var(--lblue);color:var(--ink)}
@media(max-width:720px){
  .mmf-days-row{grid-template-columns:1fr}
  .kalender-week-grid{grid-template-columns:42px repeat(5,1fr)}
}