/* ==========================================================================
   Smutsputsarna — fönstertvätt, Stockholm
   Ett enda blått underlag. Kräm ovanpå. Inga gradienter i bakgrunden.
   ========================================================================== */

:root{
  /* Färg */
  --blue:#1336B1;
  --blue-ink:#0B2478;
  --cream:#F7F3E8;
  --cream-70:rgba(247,243,232,.70);
  --cream-55:rgba(247,243,232,.55);
  --cream-32:rgba(247,243,232,.32);
  --line:rgba(247,243,232,.18);
  --line-soft:rgba(247,243,232,.10);
  --card:rgba(255,255,255,.06);
  --card-hi:rgba(255,255,255,.10);

  /* Rum */
  --s-25:2px; --s-50:4px; --s-75:8px; --s-100:12px; --s-200:16px;
  --s-300:24px; --s-400:32px; --s-500:40px; --s-600:48px;
  --s-700:64px; --s-800:80px; --s-900:96px;

  /* Radie */
  --r-lg:8px; --r-xl:12px; --r-2xl:16px; --r-3xl:24px; --r-full:9999px;

  /* Rörelse */
  --ease:cubic-bezier(0.32,0.72,0,1);
  --dur:700ms;

  --shell:1200px;
}

*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto;}}

body{
  margin:0;
  background:var(--blue);
  color:var(--cream);
  font-family:"Manrope",ui-sans-serif,system-ui,"Segoe UI",sans-serif;
  font-size:16px;line-height:24px;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  text-wrap:pretty;
  overflow-x:hidden;
}

img{max-width:100%;display:block;}
[hidden]{display:none !important;}
a{color:inherit;}
button{font:inherit;color:inherit;}

::selection{background:var(--cream);color:var(--blue);}

:focus-visible{
  outline:3px solid var(--cream);
  outline-offset:3px;
  border-radius:var(--r-lg);
}

.skip{
  position:absolute;left:var(--s-200);top:-80px;z-index:100;
  background:var(--cream);color:var(--blue);
  padding:var(--s-100) var(--s-300);border-radius:var(--r-full);
  font-weight:600;font-size:14px;line-height:20px;text-decoration:none;
  transition:top var(--dur) var(--ease);
}
.skip:focus{top:var(--s-200);}

/* ---------- Typografi ---------- */

.display{
  font-family:"Lemonada",ui-rounded,"Manrope",sans-serif;
  font-weight:700;
  letter-spacing:-0.01em;
  text-wrap:balance;
}

h1,h2,h3,h4{margin:0;font-weight:700;text-wrap:balance;}
p{margin:0;}

.eyebrow{
  font-size:12px;line-height:16px;font-weight:700;
  letter-spacing:.16em;text-transform:uppercase;
  color:var(--cream-55);
}

.lead{font-size:18px;line-height:28px;color:var(--cream-70);}
@media (min-width:768px){.lead{font-size:20px;line-height:28px;}}

/* ---------- Rutnät ---------- */

.shell{width:100%;max-width:var(--shell);margin:0 auto;padding:0 var(--s-300);}
@media (min-width:768px){.shell{padding:0 var(--s-500);}}

section{position:relative;}
.band{padding:var(--s-700) 0;}
@media (min-width:768px){.band{padding:var(--s-900) 0;}}

.rule{height:1px;background:var(--line-soft);border:0;margin:0;}

/* ---------- Knappar ---------- */

.btn{
  display:inline-flex;align-items:center;gap:var(--s-75);
  padding:var(--s-100) var(--s-300);
  border-radius:var(--r-full);border:1px solid transparent;
  font-size:16px;line-height:24px;font-weight:600;
  text-decoration:none;cursor:pointer;white-space:nowrap;
  transition:transform var(--dur) var(--ease),background-color var(--dur) var(--ease),
             color var(--dur) var(--ease),border-color var(--dur) var(--ease),opacity var(--dur) var(--ease);
}
.btn svg{width:18px;height:18px;flex:none;}
.btn--primary{background:var(--cream);color:var(--blue);}
.btn--primary:hover{background:#FFFFFF;transform:translateY(-2px);}
.btn--primary:active{transform:scale(.98) translateY(0);}
.btn--ghost{background:transparent;color:var(--cream);border-color:var(--line);}
.btn--ghost:hover{background:var(--card-hi);border-color:var(--cream-32);transform:translateY(-2px);}
.btn--ghost:active{transform:scale(.98) translateY(0);}
.btn--sm{font-size:14px;line-height:20px;padding:var(--s-75) var(--s-200);}
.btn[aria-disabled="true"]{opacity:.45;pointer-events:none;}

/* ---------- Ö-navigation ---------- */

.nav{position:fixed;inset:0 0 auto 0;z-index:60;pointer-events:none;}
.nav__pill{
  pointer-events:auto;
  margin:var(--s-300) auto 0;width:max-content;max-width:calc(100% - var(--s-400));
  display:flex;align-items:center;gap:var(--s-300);
  padding:var(--s-75) var(--s-75) var(--s-75) var(--s-200);
  border-radius:var(--r-full);
  border:1px solid var(--line);
  background:rgba(11,36,120,.55);
  backdrop-filter:blur(18px) saturate(140%);
  -webkit-backdrop-filter:blur(18px) saturate(140%);
  transition:background-color var(--dur) var(--ease),border-color var(--dur) var(--ease),transform var(--dur) var(--ease);
}
.nav--scrolled .nav__pill{background:rgba(11,36,120,.82);}
.nav__brand{display:flex;align-items:center;gap:var(--s-75);text-decoration:none;padding:var(--s-25) var(--s-50);}
.nav__brand svg{width:25px;height:25px;}
.nav__brand span{font-family:"Lemonada",sans-serif;font-weight:700;font-size:16px;line-height:24px;}
/* Ordmärket är långt, dra ihop piller och grad på små skärmar. */
@media (max-width:480px){
  .nav__pill{gap:var(--s-200);padding-left:var(--s-100);}
  .nav__brand span{font-size:14px;line-height:20px;}
  .nav__brand svg{width:22px;height:22px;}
}
.nav__links{display:none;align-items:center;gap:var(--s-300);}
@media (min-width:960px){.nav__links{display:flex;}}
.nav__links a{
  font-size:14px;line-height:20px;font-weight:500;color:var(--cream-70);
  text-decoration:none;position:relative;padding:var(--s-50) 0;
  transition:color var(--dur) var(--ease);
}
.nav__links a::after{
  content:"";position:absolute;left:0;right:100%;bottom:0;height:1.5px;
  background:var(--cream);transition:right var(--dur) var(--ease);
}
.nav__links a:hover{color:var(--cream);}
.nav__links a:hover::after{right:0;}
.nav__links a[aria-current="page"]{color:var(--cream);}
.nav__links a[aria-current="page"]::after{right:0;}

.burger{
  display:grid;place-items:center;width:40px;height:40px;
  border-radius:var(--r-full);border:1px solid var(--line);
  background:transparent;cursor:pointer;position:relative;
  transition:background-color var(--dur) var(--ease);
}
@media (min-width:960px){.burger{display:none;}}
.burger:hover{background:var(--card-hi);}
.burger i{
  position:absolute;left:11px;width:18px;height:1.8px;background:var(--cream);border-radius:2px;
  transition:transform var(--dur) var(--ease),opacity var(--dur) var(--ease);
}
.burger i:nth-child(1){transform:translateY(-5px);}
.burger i:nth-child(2){transform:translateY(5px);}
.nav--open .burger i:nth-child(1){transform:translateY(0) rotate(45deg);}
.nav--open .burger i:nth-child(2){transform:translateY(0) rotate(-45deg);}

.sheet{
  position:fixed;inset:0;z-index:55;pointer-events:none;
  background:rgba(11,36,120,.80);
  backdrop-filter:blur(40px) saturate(140%);
  -webkit-backdrop-filter:blur(40px) saturate(140%);
  opacity:0;
  transition:opacity var(--dur) var(--ease);
  display:grid;align-content:center;justify-items:start;
  padding:var(--s-800) var(--s-400);
}
.nav--open ~ .sheet,.sheet.is-open{opacity:1;pointer-events:auto;}
.sheet a{
  font-family:"Lemonada",sans-serif;font-weight:700;
  font-size:36px;line-height:40px;text-decoration:none;
  padding:var(--s-75) 0;
  opacity:0;transform:translateY(48px);
  transition:opacity var(--dur) var(--ease),transform var(--dur) var(--ease);
}
.sheet.is-open a{opacity:1;transform:translateY(0);}
.sheet.is-open a:nth-child(1){transition-delay:100ms;}
.sheet.is-open a:nth-child(2){transition-delay:150ms;}
.sheet.is-open a:nth-child(3){transition-delay:200ms;}
.sheet.is-open a:nth-child(4){transition-delay:250ms;}
.sheet.is-open a:nth-child(5){transition-delay:300ms;}

/* ---------- Avslöjande vid rullning ---------- */

.reveal{opacity:0;transform:translateY(64px);filter:blur(12px);
  transition:opacity 900ms var(--ease),transform 900ms var(--ease),filter 900ms var(--ease);}
.reveal.is-in{opacity:1;transform:none;filter:blur(0);}
.reveal[data-delay="1"]{transition-delay:80ms;}
.reveal[data-delay="2"]{transition-delay:160ms;}
.reveal[data-delay="3"]{transition-delay:240ms;}
.reveal[data-delay="4"]{transition-delay:320ms;}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;filter:none;transition:none;}
  .sheet a{opacity:1;transform:none;}
}

/* ---------- Hjälte ---------- */

.hero{padding:calc(var(--s-900) + var(--s-500)) 0 var(--s-700);}
@media (min-width:768px){.hero{padding:calc(var(--s-900) + var(--s-800)) 0 var(--s-900);}}

.hero .eyebrow{margin-bottom:var(--s-200);}
.hero h1{
  font-family:"Lemonada",sans-serif;font-weight:700;
  font-size:36px;line-height:40px;max-width:680px;
  background:linear-gradient(90deg,#FDFBF4 0%,#A7BBE8 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.hero__sub{max-width:680px;margin-top:var(--s-300);}
.hero__cta{display:flex;flex-wrap:wrap;gap:var(--s-200);margin-top:var(--s-500);}
.hero__proof{
  display:flex;flex-wrap:wrap;gap:var(--s-300);margin-top:var(--s-500);
  font-size:14px;line-height:20px;color:var(--cream-70);
}
.hero__proof span{display:inline-flex;align-items:center;gap:var(--s-75);}
.hero__proof svg{width:16px;height:16px;flex:none;}

.hero__grid{display:grid;gap:var(--s-600);align-items:center;}
@media (min-width:1000px){.hero__grid{grid-template-columns:1.05fr .95fr;gap:var(--s-700);}}

.frame{
  border-radius:var(--r-3xl);border:1px solid var(--line);
  background:var(--card);padding:var(--s-75);
  overflow:hidden;
}
.frame img{border-radius:var(--r-2xl);width:100%;height:100%;object-fit:cover;}
.frame--tall img{aspect-ratio:4/5;}
.frame--wide img{aspect-ratio:3/2;}
.frame--square img{aspect-ratio:1/1;}

/* ---------- Sifferrad ---------- */

.stats{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s-300);}
@media (min-width:768px){.stats{grid-template-columns:repeat(4,1fr);gap:var(--s-400);}}
.stat{border-top:1px solid var(--line);padding-top:var(--s-200);}
.stat b{
  display:block;font-family:"Lemonada",sans-serif;font-weight:700;
  font-size:30px;line-height:36px;
}
.stat span{display:block;margin-top:var(--s-50);font-size:14px;line-height:20px;color:var(--cream-70);}

/* ---------- Kort ---------- */

.cards{display:grid;gap:var(--s-300);}
@media (min-width:720px){.cards--2{grid-template-columns:repeat(2,1fr);}}
@media (min-width:900px){.cards--3{grid-template-columns:repeat(3,1fr);}}
@media (min-width:900px){.cards--4{grid-template-columns:repeat(2,1fr);}}
@media (min-width:1120px){.cards--4{grid-template-columns:repeat(4,1fr);}}

.card{
  border:1px solid var(--line);border-radius:var(--r-3xl);
  background:var(--card);padding:var(--s-400);
  transition:background-color var(--dur) var(--ease),transform var(--dur) var(--ease),border-color var(--dur) var(--ease);
}
.card:hover{background:var(--card-hi);border-color:var(--cream-32);transform:translateY(-4px);}
.card__icon{
  width:44px;height:44px;border-radius:var(--r-xl);
  display:grid;place-items:center;background:rgba(247,243,232,.12);
  margin-bottom:var(--s-300);
}
.card__icon svg{width:24px;height:24px;}
.card h3{font-size:20px;line-height:28px;margin-bottom:var(--s-75);}
.card p{font-size:16px;line-height:24px;color:var(--cream-70);}

/* ---------- Sektionshuvud ---------- */

.head{max-width:680px;margin-bottom:var(--s-600);}
.head h2{font-family:"Lemonada",sans-serif;font-size:30px;line-height:36px;margin-top:var(--s-200);}
@media (min-width:768px){.head h2{font-size:36px;line-height:40px;}}
.head p{margin-top:var(--s-200);font-size:18px;line-height:28px;color:var(--cream-70);}

/* ---------- Tagline-avslöjande ---------- */

.tagline{padding:var(--s-900) 0;}
.tagline p{
  font-family:"Lemonada",sans-serif;font-weight:700;
  font-size:30px;line-height:36px;max-width:680px;
}
@media (min-width:768px){.tagline p{font-size:36px;line-height:40px;}}
@media (min-width:1100px){.tagline p{font-size:48px;line-height:1.12;}}
.tagline .w{
  color:rgba(247,243,232,.28);
  transition:color 600ms var(--ease);
}
.tagline .w.on{color:var(--cream);}

/* ---------- Steg ---------- */

.steps{display:grid;gap:var(--s-500);counter-reset:step;}
@media (min-width:900px){.steps{grid-template-columns:repeat(3,1fr);gap:var(--s-400);}}
.step{border-top:1px solid var(--line);padding-top:var(--s-300);}
.step b{
  display:grid;place-items:center;width:36px;height:36px;border-radius:var(--r-full);
  background:var(--cream);color:var(--blue);font-size:14px;line-height:20px;font-weight:700;
  margin-bottom:var(--s-200);
}
.step h3{font-size:20px;line-height:28px;margin-bottom:var(--s-75);}
.step p{color:var(--cream-70);}

/* ---------- Team ---------- */

.team__grid{display:grid;gap:var(--s-300);}
@media (min-width:768px){.team__grid{grid-template-columns:repeat(3,1fr);}}
.team__grid figure{margin:0;}
.team__grid figcaption{margin-top:var(--s-200);font-size:14px;line-height:20px;color:var(--cream-70);}
.split{display:grid;gap:var(--s-600);align-items:center;}
@media (min-width:900px){.split{grid-template-columns:1fr 1fr;gap:var(--s-700);}}

/* ---------- Pris ---------- */

.price{
  border:1px solid var(--line);border-radius:var(--r-3xl);
  background:var(--card);padding:var(--s-400);
  display:flex;flex-direction:column;
  transition:background-color var(--dur) var(--ease),transform var(--dur) var(--ease),border-color var(--dur) var(--ease);
}
.price:hover{background:var(--card-hi);transform:translateY(-4px);border-color:var(--cream-32);}
.price--lift{background:var(--cream);color:var(--blue);border-color:var(--cream);}
.price--lift:hover{background:#FFFFFF;}
.price__tag{display:flex;align-items:baseline;gap:var(--s-75);margin:var(--s-200) 0 var(--s-300);}
.price__tag b{font-family:"Lemonada",sans-serif;font-size:36px;line-height:40px;}
.price__tag span{font-size:14px;line-height:20px;opacity:.7;}
.price h3{font-size:20px;line-height:28px;}
.price ul{list-style:none;margin:0 0 var(--s-400);padding:0;display:grid;gap:var(--s-100);}
.price li{display:flex;gap:var(--s-75);font-size:16px;line-height:24px;}
.price li svg{width:18px;height:18px;flex:none;margin-top:3px;}
.price .btn{margin-top:auto;justify-content:center;}
.price--lift .btn{background:var(--blue);color:var(--cream);}
.price--lift .btn:hover{background:var(--blue-ink);}
.price__note{margin-top:var(--s-300);font-size:14px;line-height:20px;color:var(--cream-55);}
.price--lift .price__note{color:rgba(19,54,177,.7);}
.price--lift p{color:rgba(19,54,177,.75);}
.badge{
  display:inline-flex;align-items:center;padding:var(--s-25) var(--s-100);
  border-radius:var(--r-full);font-size:12px;line-height:16px;font-weight:700;
  letter-spacing:.08em;text-transform:uppercase;
  background:var(--blue);color:var(--cream);
}

/* ---------- Omdömen ---------- */

.quote{
  border:1px solid var(--line);border-radius:var(--r-3xl);
  background:var(--card);padding:var(--s-400);
  display:flex;flex-direction:column;gap:var(--s-300);
}
.quote p{font-size:18px;line-height:28px;}
.quote footer{display:flex;align-items:center;gap:var(--s-200);margin-top:auto;}
.avatar{
  width:40px;height:40px;border-radius:var(--r-full);flex:none;
  display:grid;place-items:center;font-size:14px;line-height:20px;font-weight:700;
  background:rgba(247,243,232,.14);
}
.quote cite{font-style:normal;font-size:14px;line-height:20px;}
.quote cite span{display:block;color:var(--cream-55);}

/* ---------- Frågor ---------- */

.faq{display:grid;gap:0;border-top:1px solid var(--line);}
.faq details{border-bottom:1px solid var(--line);}
.faq summary{
  list-style:none;cursor:pointer;padding:var(--s-300) 0;
  display:flex;align-items:flex-start;justify-content:space-between;gap:var(--s-300);
  font-size:18px;line-height:28px;font-weight:600;
  transition:color var(--dur) var(--ease);
}
.faq summary::-webkit-details-marker{display:none;}
.faq summary:hover{color:#FFFFFF;}
.faq summary svg{width:20px;height:20px;flex:none;margin-top:var(--s-50);transition:transform var(--dur) var(--ease);}
.faq details[open] summary svg{transform:rotate(45deg);}
.faq p{padding:0 0 var(--s-300);max-width:680px;color:var(--cream-70);}

/* ---------- Slut-CTA ---------- */

.final{
  border:1px solid var(--line);border-radius:var(--r-3xl);
  background:var(--card);padding:var(--s-600) var(--s-400);text-align:center;
}
@media (min-width:768px){.final{padding:var(--s-800);}}
.final h2{font-family:"Lemonada",sans-serif;font-size:30px;line-height:36px;max-width:680px;margin:0 auto;}
@media (min-width:768px){.final h2{font-size:36px;line-height:40px;}}
.final p{margin:var(--s-200) auto 0;max-width:680px;color:var(--cream-70);}
.final .hero__cta{justify-content:center;}

/* ---------- Fot ---------- */

.foot{border-top:1px solid var(--line);padding:var(--s-600) 0 var(--s-500);}
.foot__grid{display:grid;gap:var(--s-500);}
@media (min-width:768px){.foot__grid{grid-template-columns:1.4fr 1fr 1fr;}}
.foot h4{font-size:12px;line-height:16px;letter-spacing:.16em;text-transform:uppercase;color:var(--cream-55);margin-bottom:var(--s-200);}
.foot ul{list-style:none;margin:0;padding:0;display:grid;gap:var(--s-75);}
.foot a{font-size:14px;line-height:20px;color:var(--cream-70);text-decoration:none;transition:color var(--dur) var(--ease);}
.foot a:hover{color:var(--cream);}
.foot__brand{display:flex;align-items:center;gap:var(--s-100);margin-bottom:var(--s-200);}
.foot__brand svg{width:32px;height:32px;}
.foot__brand b{font-family:"Lemonada",sans-serif;font-size:18px;line-height:28px;}
.foot__legal{
  margin-top:var(--s-500);padding-top:var(--s-300);border-top:1px solid var(--line-soft);
  display:flex;flex-wrap:wrap;gap:var(--s-300);justify-content:space-between;
  font-size:12px;line-height:16px;color:var(--cream-55);
}

/* ---------- Kakor ---------- */

.cookie{
  position:fixed;left:var(--s-300);right:var(--s-300);bottom:var(--s-300);z-index:70;
  max-width:520px;margin:0 auto;
  border:1px solid var(--line);border-radius:var(--r-2xl);
  background:rgba(11,36,120,.92);
  backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
  padding:var(--s-300);
  display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-200);
  transform:translateY(160%);
  transition:transform var(--dur) var(--ease);
}
.cookie.is-in{transform:translateY(0);}
.cookie p{font-size:14px;line-height:20px;color:var(--cream-70);flex:1 1 240px;}

/* ---------- Bokningssidan ---------- */

.booking{padding:calc(var(--s-900) + var(--s-400)) 0 var(--s-700);}
@media (min-width:768px){.booking{padding:calc(var(--s-900) + var(--s-600)) 0 var(--s-900);}}
.booking__grid{display:grid;gap:var(--s-500);align-items:start;}
@media (min-width:1000px){.booking__grid{grid-template-columns:1fr 1fr;gap:var(--s-600);}}

.panel{
  border:1px solid var(--line);border-radius:var(--r-3xl);
  background:var(--card);padding:var(--s-300);
}
.panel__head{padding:var(--s-200) var(--s-200) var(--s-300);}
.panel__head h2{font-family:"Lemonada",sans-serif;font-size:24px;line-height:32px;}
.panel__head p{margin-top:var(--s-75);font-size:14px;line-height:20px;color:var(--cream-70);}

.calendly-inline-widget{
  min-height:680px;width:100%;display:block;
  border-radius:var(--r-2xl);overflow:hidden;background:rgba(255,255,255,.04);
}
.cal-skeleton{display:grid;gap:var(--s-200);padding:var(--s-300);}
.cal-skeleton i{
  display:block;height:14px;border-radius:var(--r-lg);
  background:linear-gradient(90deg,rgba(247,243,232,.10),rgba(247,243,232,.20),rgba(247,243,232,.10));
  background-size:200% 100%;animation:sheen 1.6s var(--ease) infinite;
}
.cal-skeleton i:nth-child(1){width:45%;height:22px;}
.cal-skeleton i:nth-child(2){width:70%;}
.cal-skeleton i:nth-child(3){width:100%;height:200px;}
.cal-skeleton i:nth-child(4){width:60%;}
@keyframes sheen{0%{background-position:200% 0;}100%{background-position:-200% 0;}}
@media (prefers-reduced-motion:reduce){.cal-skeleton i{animation:none;}}

.cal-fallback{padding:var(--s-300);display:grid;gap:var(--s-300);}
.cal-fallback h3{font-size:20px;line-height:28px;}
.cal-fallback p{font-size:16px;line-height:24px;color:var(--cream-70);}
.field{display:grid;gap:var(--s-75);}
.field label{font-size:14px;line-height:20px;font-weight:600;}
.field input,.field textarea,.field select{
  width:100%;padding:var(--s-100) var(--s-200);
  border-radius:var(--r-xl);border:1px solid var(--line);
  background:rgba(255,255,255,.06);color:var(--cream);
  font-family:inherit;font-size:16px;line-height:24px;
  transition:border-color var(--dur) var(--ease),background-color var(--dur) var(--ease);
}
.field input::placeholder,.field textarea::placeholder{color:var(--cream-32);}
.field input:hover,.field textarea:hover,.field select:hover{border-color:var(--cream-32);}
.field .err{font-size:14px;line-height:20px;color:#FFD9C7;min-height:0;}
.field[data-invalid="true"] input,.field[data-invalid="true"] textarea{border-color:#FFD9C7;}
.form-row{display:grid;gap:var(--s-200);}
@media (min-width:600px){.form-row{grid-template-columns:1fr 1fr;}}
.form-status{font-size:14px;line-height:20px;color:var(--cream-70);}

/* Galleri */
.gallery{position:relative;border-radius:var(--r-3xl);border:1px solid var(--line);background:var(--card);padding:var(--s-75);}
.gallery__stage{position:relative;border-radius:var(--r-2xl);overflow:hidden;aspect-ratio:4/5;background:rgba(255,255,255,.04);}
@media (min-width:1000px){.gallery__stage{aspect-ratio:auto;height:680px;}}
.gallery__slide{
  position:absolute;inset:0;opacity:0;
  transition:opacity 1200ms var(--ease),transform 1600ms var(--ease);
  transform:scale(1.04);
}
.gallery__slide.is-on{opacity:1;transform:scale(1);z-index:1;}
.gallery__slide img{width:100%;height:100%;object-fit:cover;}
.gallery__shade{
  position:absolute;inset:0;
  background:linear-gradient(to top,rgba(11,36,120,.85) 0%,rgba(11,36,120,.25) 38%,rgba(11,36,120,0) 62%);
  pointer-events:none;
}
.gallery__caption{
  position:absolute;right:var(--s-300);bottom:var(--s-300);z-index:3;
  max-width:min(320px,72%);text-align:right;
  border:1px solid var(--line);border-radius:var(--r-2xl);
  background:rgba(11,36,120,.72);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  padding:var(--s-100) var(--s-200);
}
.gallery__caption b{display:block;font-size:14px;line-height:20px;font-weight:700;}
.gallery__caption span{display:block;margin-top:var(--s-25);font-size:12px;line-height:16px;color:var(--cream-70);}
.gallery__bar{
  position:absolute;left:var(--s-300);right:var(--s-300);top:var(--s-300);z-index:3;
  display:flex;gap:var(--s-50);
}
.gallery__bar i{flex:1;height:2px;border-radius:2px;background:rgba(247,243,232,.28);overflow:hidden;}
.gallery__bar i b{display:block;height:100%;width:0;background:var(--cream);}
.gallery__bar i.is-on b{width:100%;transition:width 5000ms linear;}
.gallery__bar i.is-done b{width:100%;}
.gallery__nav{
  position:absolute;left:var(--s-300);bottom:var(--s-300);z-index:3;display:flex;gap:var(--s-75);
}
.gallery__nav button{
  width:36px;height:36px;border-radius:var(--r-full);
  border:1px solid var(--line);background:rgba(11,36,120,.6);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  display:grid;place-items:center;cursor:pointer;
  transition:background-color var(--dur) var(--ease),transform var(--dur) var(--ease);
}
.gallery__nav button:hover{background:rgba(11,36,120,.9);transform:translateY(-2px);}
.gallery__nav button:active{transform:scale(.96);}
.gallery__nav svg{width:16px;height:16px;}

/* På smala skärmar krockar bildtexten med pilarna, lyft den ovanför. */
@media (max-width:700px){
  .gallery__caption{bottom:calc(var(--s-300) + 44px);max-width:82%;}
}

/* ---------- Enkla sidor ---------- */

.prose{max-width:680px;padding:calc(var(--s-900) + var(--s-400)) 0 var(--s-800);}
.prose h1{font-family:"Lemonada",sans-serif;font-size:36px;line-height:40px;margin-bottom:var(--s-300);}
.prose h2{font-size:20px;line-height:28px;margin:var(--s-500) 0 var(--s-100);}
.prose p,.prose li{color:var(--cream-70);margin-bottom:var(--s-200);}
.prose ul{padding-left:var(--s-300);}

.oops{min-height:100svh;display:grid;place-items:center;text-align:center;padding:var(--s-600) var(--s-300);}
.oops h1{font-family:"Lemonada",sans-serif;font-size:72px;line-height:1;margin-bottom:var(--s-200);}
.oops p{color:var(--cream-70);max-width:520px;margin:0 auto var(--s-400);}

/* ---------- Namnlista ---------- */

.roster{list-style:none;margin:var(--s-500) 0 0;padding:0;display:grid;gap:var(--s-100);}
.roster li{
  display:flex;align-items:center;gap:var(--s-200);
  border-top:1px solid var(--line);padding-top:var(--s-100);
}
.roster b{display:block;font-size:16px;line-height:24px;font-weight:700;}
.roster span:last-child{display:block;font-size:14px;line-height:20px;color:var(--cream-70);}

.team__stack{display:grid;gap:var(--s-300);}