*{box-sizing:border-box}html,body{margin:0;font-family:Arial,Helvetica,sans-serif;background:#080808;color:#fff}body{min-height:100vh}header{height:82px;background:#080808;display:flex;align-items:center;justify-content:flex-end;padding:0 5.5vw;gap:42px;position:relative;z-index:20}nav{display:flex;gap:42px;align-items:center}nav a{color:#fff;text-decoration:none;font-size:17px;padding:29px 0 23px;border-bottom:3px solid transparent}nav a.active{color:#f26722;border-color:#f26722}.langs{display:flex;border:1px solid #555;border-radius:7px;overflow:hidden}.langs button{border:0;background:transparent;color:#fff;padding:11px 17px;font-size:15px}.langs button.active{color:#f26722;border-right:1px solid #555}.menu{display:none}.hero{position:relative;min-height:calc(100vh - 82px);overflow:hidden}.slides,.slide,.shade{position:absolute;inset:0}.slide{background-size:cover;background-position:center;opacity:0;transition:opacity 1.4s ease}.slide.active{opacity:1}.slide:nth-child(1){background-position:center 42%}.slide:nth-child(2){background-position:center 43%}.slide:nth-child(3){background-position:center 42%}.slide:nth-child(4){background-position:center 45%}.shade{background:linear-gradient(90deg,rgba(0,0,0,.78) 0%,rgba(0,0,0,.5) 33%,rgba(0,0,0,.12) 62%,rgba(0,0,0,.06) 100%)}.content{position:relative;z-index:5;width:min(620px,47vw);padding:7vh 0 7vh 5.5vw;display:flex;flex-direction:column;align-items:flex-start}.logo{width:min(760px,56vw);max-height:410px;object-fit:contain;object-position:left center;margin-bottom:64px}h1{font-size:clamp(34px,3.6vw,62px);line-height:1.05;margin:0 0 34px;font-weight:800;letter-spacing:-1.5px}.actions{display:flex;gap:16px}.actions a{display:inline-flex;align-items:center;justify-content:center;min-width:150px;padding:15px 25px;border-radius:6px;text-decoration:none;font-weight:700}.primary{background:#f26722;color:#fff}.secondary{border:2px solid #fff;color:#fff;background:rgba(0,0,0,.18)}.counter{position:absolute;z-index:6;right:4vw;bottom:30px;font-size:14px;letter-spacing:2px;color:rgba(255,255,255,.75)}#current{color:#f26722;font-weight:bold}.menu{background:none;border:0;color:#fff;font-size:27px}


/* V19: give the hero logo more breathing room */
.hero-logo{margin-bottom:48px!important;}

@media(max-width:760px){.brand-logo,.hero-logo{margin-bottom:34px!important;}}


.mobile-logo-wrap{display:none}

@media(max-width:760px){
  html,body{
    margin:0;
    padding:0;
    background:#080808;
  }

  header{
    height:62px;
    padding:0 16px;
    justify-content:space-between;
  }
  .menu{display:block}
  nav{display:none}
  .langs button{padding:8px 11px}

  /* Let content determine the height. This removes the large empty black tail. */
  .hero{
    min-height:0!important;
    height:auto!important;
    overflow:hidden;
    background:#080808;
    display:flex;
    flex-direction:column;
  }

  .mobile-logo-wrap{
    display:flex;
    justify-content:center;
    align-items:center;
    padding:15px 18px 8px;
    background:#080808;
    position:relative;
    z-index:8;
  }
  .mobile-logo{
    display:block;
    width:min(76vw,300px);
    max-height:145px;
    height:auto;
    object-fit:contain;
  }

  .content .logo{display:none}

  /* Photo block */
  .slides{
    position:relative!important;
    inset:auto!important;
    width:100%;
    height:390px;
    flex:none;
    overflow:hidden;
    background:#080808;
  }
  .slide{
    position:absolute;
    inset:0;
    opacity:0;
    transition:opacity 1.4s ease;
    background-repeat:no-repeat;
    background-size:cover;
  }
  .slide.active{opacity:1}

  .slide:nth-child(1){
    background-image:url('assets/tortor.jpg')!important;
    background-position:50% 42%!important;
  }
  .slide:nth-child(2){
    background-image:url('assets/hestia.jpg')!important;
    background-position:50% 38%!important;
  }
  .slide:nth-child(3){
    background-image:url('assets/lola.jpg')!important;
    background-position:45% 42%!important;
  }
  .slide:nth-child(4){
    background-image:url('assets/caeneus.jpg')!important;
    background-position:50% 38%!important;
  }

  /* Fade BOTH edges of the photograph into the black surrounding sections. */
  .slides::before,
  .slides::after{
    content:"";
    position:absolute;
    z-index:5;
    left:0;
    right:0;
    height:46px;
    pointer-events:none;
  }
  .slides::before{
    top:0;
    background:linear-gradient(180deg,#080808 0%,rgba(8,8,8,.62) 28%,rgba(8,8,8,0) 100%);
  }
  .slides::after{
    bottom:0;
    background:linear-gradient(180deg,rgba(8,8,8,0) 0%,rgba(8,8,8,.62) 72%,#080808 100%);
  }

  /* Old overlay is no longer needed because the photo element handles both fades. */
  .shade{display:none!important}

  .content{
    position:relative!important;
    inset:auto!important;
    z-index:7;
    width:100%;
    min-height:0!important;
    height:auto!important;
    padding:4px 18px 18px;
    margin:0;
    background:#080808;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:flex-start;
    text-align:left;
  }

  h1{
    width:100%;
    max-width:500px;
    font-size:clamp(24px,6.4vw,31px);
    line-height:1.08;
    margin:0 0 14px;
    letter-spacing:-.5px;
  }

  .actions{
    width:100%;
    max-width:500px;
    display:flex;
    gap:8px;
    flex-wrap:nowrap;
  }
  .actions a{
    flex:1;
    min-width:0;
    max-width:none;
    padding:11px 8px;
    font-size:12px;
  }

  .counter{
    position:relative!important;
    right:auto!important;
    bottom:auto!important;
    margin:8px 0 0 auto;
    font-size:11px;
  }
}

@media(max-width:420px){
  .mobile-logo-wrap{padding-top:12px;padding-bottom:6px}
  .mobile-logo{width:72vw;max-height:135px}
  .slides{height:370px}
  .content{padding:3px 14px 12px}
  h1{font-size:23px;margin-bottom:12px}
  .actions a{font-size:11px;padding:10px 7px}
}


/* V27: remove remaining empty mobile space below the hero */
@media(max-width:760px){
  html,body{
    min-height:0!important;
    height:auto!important;
  }

  body{
    display:block!important;
  }

  main.hero{
    min-height:0!important;
    height:auto!important;
    max-height:none!important;
    padding-bottom:0!important;
    margin-bottom:0!important;
  }

  .content{
    padding-bottom:10px!important;
    margin-bottom:0!important;
  }

  .counter{
    position:absolute!important;
    right:10px!important;
    bottom:5px!important;
    margin:0!important;
  }

  main.hero::after,
  body::after{
    display:none!important;
    content:none!important;
  }
}


/* V28 mobile refinement */
@media(max-width:760px){
  .hero{
    display:flex!important;
    flex-direction:column!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    padding:0!important;
    margin:0!important;
  }

  .slides{
    height:390px!important;
    min-height:0!important;
    max-height:390px!important;
    flex:0 0 390px!important;
  }

  /* Zoom the photos slightly inside the SAME 390px frame. */
  .slide{
    background-size:112% auto!important;
    background-color:#080808!important;
  }

  .content{
    position:relative!important;
    top:auto!important;
    right:auto!important;
    bottom:auto!important;
    left:auto!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    flex:0 0 auto!important;
    padding:4px 18px 10px!important;
    margin:0!important;
  }

  .counter{
    display:none!important;
  }
}

@media(max-width:420px){
  .slides{
    height:370px!important;
    max-height:370px!important;
    flex-basis:370px!important;
  }
  .slide{
    background-size:116% auto!important;
  }
}


/* V29: definitive mobile sizing + per-slide edge fades */
@media(max-width:760px){
  html,body{
    min-height:0!important;
    height:auto!important;
    overflow-x:hidden!important;
  }

  main.hero{
    position:relative!important;
    display:flex!important;
    flex-direction:column!important;
    min-height:0!important;
    height:auto!important;
    max-height:none!important;
    overflow:hidden!important;
    padding:0!important;
    margin:0!important;
  }

  .mobile-logo-wrap{
    flex:0 0 auto!important;
  }

  .slides{
    position:relative!important;
    inset:auto!important;
    flex:0 0 410px!important;
    height:410px!important;
    min-height:410px!important;
    max-height:410px!important;
    overflow:hidden!important;
    isolation:isolate!important;
  }

  .slide{
    position:absolute!important;
    inset:0!important;
    height:100%!important;
    width:100%!important;
    background-size:cover!important;
  }

  /* Each slide gets its own top and bottom fade via mask.
     This survives the carousel opacity changes and cannot be hidden behind another layer. */
  @supports ((-webkit-mask-image:linear-gradient(#000,#000)) or (mask-image:linear-gradient(#000,#000))){
    .slide{
      -webkit-mask-image:linear-gradient(
        to bottom,
        transparent 0,
        rgba(0,0,0,.55) 4%,
        #000 10%,
        #000 90%,
        rgba(0,0,0,.55) 96%,
        transparent 100%
      )!important;
      mask-image:linear-gradient(
        to bottom,
        transparent 0,
        rgba(0,0,0,.55) 4%,
        #000 10%,
        #000 90%,
        rgba(0,0,0,.55) 96%,
        transparent 100%
      )!important;
    }
    .slides::before,.slides::after{display:none!important}
  }

  /* Fallback fades for browsers without CSS masks. */
  .slides::before,.slides::after{
    content:""!important;
    display:block!important;
    position:absolute!important;
    z-index:20!important;
    left:0!important;
    right:0!important;
    height:48px!important;
    pointer-events:none!important;
  }
  .slides::before{
    top:0!important;
    background:linear-gradient(to bottom,#080808,rgba(8,8,8,0))!important;
  }
  .slides::after{
    bottom:0!important;
    background:linear-gradient(to bottom,rgba(8,8,8,0),#080808)!important;
  }

  .shade{
    display:none!important;
    position:absolute!important;
    height:0!important;
    min-height:0!important;
  }

  .content{
    position:relative!important;
    inset:auto!important;
    flex:0 0 auto!important;
    min-height:0!important;
    height:auto!important;
    max-height:none!important;
    padding:0 18px 12px!important;
    margin:0!important;
    overflow:visible!important;
  }

  .content::after{
    display:none!important;
    content:none!important;
  }

  .counter{display:none!important}

  /* Explicitly collapse any inherited empty grid/flex space after content. */
  .hero > :last-child{
    margin-bottom:0!important;
  }
}

@media(max-width:420px){
  .slides{
    flex-basis:390px!important;
    height:390px!important;
    min-height:390px!important;
    max-height:390px!important;
  }
}


/* V30: use the phone viewport instead of leaving unused black space */
@media(max-width:760px){
  body{
    background:#080808!important;
  }

  main.hero{
    min-height:calc(100vh - 62px)!important;
    height:calc(100vh - 62px)!important;
    max-height:none!important;
    display:flex!important;
    flex-direction:column!important;
    overflow:hidden!important;
  }

  .mobile-logo-wrap{
    flex:0 0 auto!important;
  }

  /* Let the photograph absorb all remaining screen height. */
  .slides{
    flex:1 1 auto!important;
    height:auto!important;
    min-height:390px!important;
    max-height:none!important;
  }

  .content{
    flex:0 0 auto!important;
    height:auto!important;
    min-height:0!important;
    padding-bottom:12px!important;
  }

  /* Keep every slide faded at both edges. */
  .slide{
    -webkit-mask-image:linear-gradient(
      to bottom,
      transparent 0%,
      rgba(0,0,0,.7) 5%,
      #000 11%,
      #000 89%,
      rgba(0,0,0,.7) 95%,
      transparent 100%
    )!important;
    mask-image:linear-gradient(
      to bottom,
      transparent 0%,
      rgba(0,0,0,.7) 5%,
      #000 11%,
      #000 89%,
      rgba(0,0,0,.7) 95%,
      transparent 100%
    )!important;
  }
}

@media(max-width:420px){
  main.hero{
    min-height:calc(100vh - 62px)!important;
    height:calc(100vh - 62px)!important;
  }
  .slides{
    min-height:360px!important;
    height:auto!important;
    max-height:none!important;
    flex:1 1 auto!important;
  }
}


/* V31: mobile photo framing only */
@media(max-width:760px){
  /* Tortor: shift the image to the right */
  .slide:nth-child(1){
    background-position:42% 42%!important;
  }

  /* Hestia: pull her fully into frame and centre her face */
  .slide:nth-child(2){
    background-position:58% 38%!important;
  }

  /* Lola and Caeneus intentionally unchanged */
}


/* V32: locked V31 format; Hestia mobile framing adjustment only */
@media(max-width:760px){
  .slide:nth-child(2){
    background-position:64% 38%!important;
  }
}

.about-main{background:#080808;overflow:hidden}.about-intro{max-width:1050px;margin:auto;padding:110px 6vw 95px}.about-kicker{color:#f26722;text-transform:uppercase;letter-spacing:2.5px;font-size:13px;font-weight:800;margin-bottom:18px}.about-intro h1{max-width:850px;font-size:clamp(46px,6vw,86px);line-height:.98;margin:0 0 34px}.about-intro p{max-width:780px;color:#cfcfcf;font-size:20px;line-height:1.65;margin:0}.story{max-width:1280px;margin:auto;padding:90px 6vw;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(340px,.92fr);gap:75px;align-items:center;border-top:1px solid #242424}.story-nestor{grid-template-columns:minmax(340px,.82fr) minmax(0,1.18fr)}.story-image img,.nestor-gallery img{display:block;width:100%;height:auto;border-radius:4px}.story-number{display:block;color:#333;font-size:76px;font-weight:900;line-height:1;margin-bottom:20px}.story h2,.about-cta h2{font-size:clamp(34px,4vw,58px);line-height:1.03;margin:0 0 28px;letter-spacing:-1px}.story p{font-size:18px;line-height:1.7;color:#cfcfcf;margin:0 0 20px}.nestor-gallery{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:start}.nestor-gallery img:first-child{grid-column:1/-1}.about-cta{max-width:1280px;margin:auto;padding:90px 6vw 110px;border-top:1px solid #242424;display:flex;align-items:flex-end;justify-content:space-between;gap:50px}.about-cta h2{max-width:760px;margin-bottom:0}
@media(max-width:760px){header nav{display:none;position:absolute;left:0;right:0;top:62px;background:#0b0b0b;padding:18px 24px 24px;border-top:1px solid #222;flex-direction:column;align-items:flex-start;gap:0}header nav.open{display:flex;z-index:50}header nav a{width:100%;padding:14px 0;font-size:16px;border-bottom:1px solid #242424}.about-intro{padding:68px 24px 58px}.about-intro h1{font-size:44px}.about-intro p{font-size:17px;line-height:1.6}.story,.story-nestor{padding:55px 24px;display:flex;flex-direction:column;gap:35px}.story-attis .story-image{order:2}.story-attis .story-copy,.story-nestor .story-copy{order:1}.story-nestor .nestor-gallery{order:2}.story-number{font-size:54px;margin-bottom:15px}.story h2,.about-cta h2{font-size:36px}.story p{font-size:16px;line-height:1.65}.nestor-gallery{grid-template-columns:1fr;gap:14px}.nestor-gallery img:first-child{grid-column:auto}.about-cta{padding:58px 24px 70px;display:block}.about-cta .actions{margin-top:30px}}


/* V35 About refinements only */
.what-we-do{
  max-width:1280px;
  margin:0 auto;
  padding:78px 6vw 88px;
  border-top:1px solid #242424;
  display:grid;
  grid-template-columns:.75fr 1.25fr;
  gap:80px;
  align-items:start;
}
.what-we-do h2{
  font-size:clamp(38px,4.5vw,62px);
  line-height:1.02;
  margin:0;
}
.what-copy p{
  color:#cfcfcf;
  font-size:19px;
  line-height:1.7;
  margin:0 0 22px;
}

/* Give the genuine story photographs more presence. */
.story{
  max-width:1440px;
  grid-template-columns:minmax(0,1.22fr) minmax(340px,.78fr);
  gap:62px;
}
.story-nestor{
  grid-template-columns:minmax(340px,.72fr) minmax(0,1.28fr);
}
.story-image,
.nestor-gallery{
  width:100%;
}
.story-image img,
.nestor-gallery img{
  width:100%;
  border:0;
  outline:0;
  background:#080808;
  box-shadow:none;
}

/* Nestor's two supplied images work better as two large stacked photographs. */
.nestor-gallery{
  display:flex;
  flex-direction:column;
  gap:22px;
}

@media(max-width:760px){
  .what-we-do{
    padding:50px 24px 58px;
    display:block;
  }
  .what-we-do h2{font-size:36px;margin-bottom:28px}
  .what-copy p{font-size:16px;line-height:1.65}
  .story,.story-nestor{
    padding-left:18px;
    padding-right:18px;
  }
  .story-image,
  .nestor-gallery{
    width:calc(100% + 12px);
    margin-left:-6px;
  }
}


/* V36: remove the visible white separator in Nestor's composite ON THE WEBSITE.
   The original supplied image file is untouched. */
.nestor-composite{
  width:100%;
  aspect-ratio:1084 / 1408;
  display:grid;
  grid-template-rows:43.4% 56.6%;
  gap:0;
  overflow:hidden;
  border-radius:4px;
  background:#080808;
}
.nestor-crop{
  width:100%;
  min-height:0;
  background-image:url('assets/nestor-before-after.png');
  background-repeat:no-repeat;
  background-size:100% auto;
}
.nestor-before{
  background-position:center top;
}
.nestor-after{
  /* Start below the white separator and scale/position the lower photo flush
     against the upper one. */
  background-position:center bottom;
}


/* V37: Association Attis logo beneath Who are we */
.who-logo{
  display:block;
  width:min(360px,100%);
  height:auto;
  margin-top:34px;
  object-fit:contain;
  object-position:left center;
}
@media(max-width:760px){
  .who-logo{
    width:min(300px,82vw);
    margin-top:26px;
    margin-bottom:8px;
  }
}


/* V38: desktop alignment for Who are we copy only */
@media(min-width:761px){
  .what-copy{
    padding-top:58px;
  }
}


/* V39 Contact page */
.contact-main{background:#080808;min-height:calc(100vh - 82px)}
.contact-intro{max-width:1280px;margin:0 auto;padding:100px 6vw 80px;display:flex;justify-content:space-between;align-items:center;gap:80px}
.contact-title{max-width:760px}
.contact-title h1{font-size:clamp(54px,7vw,96px);line-height:.95;margin:0 0 30px}
.contact-title p{max-width:700px;color:#cfcfcf;font-size:20px;line-height:1.65;margin:0}
.contact-logo{width:min(310px,27vw);height:auto;flex:0 0 auto}
.contact-grid{max-width:1280px;margin:0 auto;padding:0 6vw 85px;display:grid;grid-template-columns:1fr 1fr;gap:1px;background:#242424;border-top:1px solid #242424;border-bottom:1px solid #242424}
.contact-card{background:#080808;padding:55px 48px;min-height:310px}
.contact-num{display:block;color:#333;font-size:52px;font-weight:900;line-height:1;margin-bottom:28px}
.contact-card h2{font-size:clamp(25px,2.4vw,36px);line-height:1.08;margin:0 0 24px}
.contact-card p{font-size:18px;line-height:1.7;color:#cfcfcf;margin:0 0 22px}
.contact-card a{color:#fff;text-decoration:none}
.contact-card p a:hover{color:#f26722}
.contact-note{color:#f26722!important;font-weight:700}
.contact-button{display:inline-flex!important;margin-top:8px;padding:14px 22px;border-radius:6px;font-weight:700}
.contact-legal{max-width:1280px;margin:0 auto;padding:80px 6vw 100px;display:grid;grid-template-columns:.65fr 1.35fr;gap:90px}
.contact-legal p{font-size:17px;line-height:1.6;color:#cfcfcf}
.contact-visit h2{font-size:clamp(32px,4vw,54px);line-height:1.03;margin:0 0 25px}
.contact-visit p{max-width:680px;font-size:18px;line-height:1.7;color:#cfcfcf;margin:0}

@media(max-width:760px){
  .contact-main{min-height:0}
  .contact-intro{padding:65px 24px 55px;display:flex;flex-direction:column;align-items:flex-start;gap:35px}
  .contact-title h1{font-size:48px}
  .contact-title p{font-size:17px;line-height:1.6}
  .contact-logo{width:min(270px,78vw)}
  .contact-grid{padding:0 18px 55px;display:block;background:#080808;border:0}
  .contact-card{padding:42px 6px;border-top:1px solid #242424;min-height:0}
  .contact-num{font-size:46px;margin-bottom:22px}
  .contact-card h2{font-size:30px}
  .contact-card p{font-size:17px}
  .contact-legal{padding:55px 24px 75px;display:block;border-top:1px solid #242424}
  .contact-visit{margin-top:55px}
  .contact-visit h2{font-size:36px}
  .contact-visit p{font-size:16px}
}


/* V40 Contact refinements */
.contact-card h2{
  font-size:clamp(30px,2.8vw,42px);
  margin-top:4px;
}
.map-link{
  display:inline-block;
  margin:2px 0 24px;
  color:#f26722!important;
  font-weight:700;
  font-size:16px;
  text-decoration:none!important;
}
.map-link:hover{text-decoration:underline!important}
@media(max-width:760px){
  .contact-card h2{font-size:34px}
}


/* V42 About page refinements */
.about-page .about-kicker,
.about-page .story-kicker,
.about-page [class*="kicker"]{
  font-size:18px;
  font-weight:800;
  letter-spacing:.12em;
}
@media(max-width:760px){
  .about-page .about-kicker,
  .about-page .story-kicker,
  .about-page [class*="kicker"]{
    font-size:16px;
  }
}


/* V43 Support Us */
.support-main{background:#080808;min-height:calc(100vh - 82px)}
.support-intro{max-width:1280px;margin:0 auto;padding:100px 6vw 85px;display:flex;align-items:center;justify-content:space-between;gap:80px}
.support-intro>div{max-width:760px}
.support-kicker{color:#f26722;font-size:18px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;margin-bottom:18px}
.support-intro h1{font-size:clamp(54px,7vw,96px);line-height:.95;margin:0 0 30px}
.support-intro p{max-width:720px;color:#cfcfcf;font-size:20px;line-height:1.65;margin:0}
.support-logo{width:min(310px,27vw);height:auto}
.support-options{max-width:1280px;margin:0 auto;padding:0 6vw 90px;display:grid;grid-template-columns:1fr 1fr;gap:1px;background:#242424}
.support-panel{background:#080808;padding:65px 50px 70px}
.support-panel h2{font-size:clamp(34px,3.5vw,52px);line-height:1.05;margin:0 0 26px}
.support-panel p{color:#cfcfcf;font-size:18px;line-height:1.7;margin:0 0 35px;max-width:540px}
.support-action{display:inline-flex;padding:15px 24px;border-radius:6px;font-weight:800;text-decoration:none}
.support-panel .secondary{border:1px solid #fff;color:#fff}
.support-panel .secondary:hover{border-color:#f26722;color:#f26722}
.support-coming{max-width:1120px;margin:0 auto;padding:75px 6vw 110px;text-align:center;border-top:1px solid #242424}
.support-coming h2{font-size:clamp(38px,5vw,64px);margin:0 0 20px}
.support-coming p{color:#aaa;font-size:18px;line-height:1.65;margin:0 auto;max-width:650px}
@media(max-width:760px){
 .support-intro{padding:65px 24px 55px;flex-direction:column;align-items:flex-start;gap:35px}
 .support-intro h1{font-size:48px}
 .support-intro p{font-size:17px}
 .support-logo{width:min(270px,78vw)}
 .support-kicker{font-size:16px}
 .support-options{display:block;padding:0 18px 55px;background:#080808}
 .support-panel{padding:48px 6px;border-top:1px solid #242424}
 .support-panel h2{font-size:36px}
 .support-panel p{font-size:17px}
 .support-coming{margin:0 24px;padding:55px 0 80px}
 .support-coming h2{font-size:40px}
}


/* V44 Support page cleanup */
.support-options{
  background:#080808;
  gap:42px;
}
.support-panel{
  background:#080808;
  border:0;
  padding-left:0;
  padding-right:0;
}
.support-coming{
  border-top:0;
}
@media(max-width:760px){
  .support-options{gap:0}
  .support-panel{border-top:0}
}


/* V45 Mobile alignment polish across interior pages only */
@media(max-width:760px){

  /* About */
  .about-page main section,
  .about-page .about-intro,
  .about-page .what-copy,
  .about-page .story-copy,
  .about-page .story-text,
  .about-page .about-cta{
    text-align:center;
  }
  .about-page .who-logo,
  .about-page main section img{
    margin-left:auto;
    margin-right:auto;
  }
  .about-page .actions{
    justify-content:center;
  }

  /* Contact */
  .contact-intro{
    align-items:center;
    text-align:center;
  }
  .contact-title,
  .contact-title p{
    margin-left:auto;
    margin-right:auto;
  }
  .contact-logo{
    margin-left:auto;
    margin-right:auto;
  }
  .contact-card{
    text-align:center;
  }
  .contact-legal{
    text-align:center;
  }
  .contact-visit p{
    margin-left:auto;
    margin-right:auto;
  }

  /* Support */
  .support-intro{
    align-items:center;
    text-align:center;
  }
  .support-intro>div,
  .support-intro p{
    margin-left:auto;
    margin-right:auto;
  }
  .support-logo{
    margin-left:auto;
    margin-right:auto;
  }
  .support-panel{
    text-align:center;
  }
  .support-panel p{
    margin-left:auto;
    margin-right:auto;
  }
  .support-coming{
    text-align:center;
  }
}


/* V46 Contact page cleanup: remove grey box/framing */
.contact-grid{
  background:#080808;
  border-top:0;
  border-bottom:0;
  gap:42px;
}
.contact-card{
  background:#080808;
  border:0;
  padding-left:0;
  padding-right:0;
}
@media(max-width:760px){
  .contact-grid{background:#080808;gap:0}
  .contact-card{border-top:0}
}


/* V47 Events feature on Support page */
.support-events{
  max-width:1120px;
  margin:0 auto;
  padding:10px 6vw 90px;
  text-align:center;
}
.support-events h2{
  font-size:clamp(38px,5vw,64px);
  line-height:1.03;
  margin:0 0 24px;
}
.support-events p{
  max-width:760px;
  margin:0 auto 34px;
  color:#cfcfcf;
  font-size:18px;
  line-height:1.7;
}
@media(max-width:760px){
  .support-events{
    padding:10px 24px 65px;
    text-align:center;
  }
  .support-events h2{font-size:40px}
  .support-events p{font-size:17px}
}


/* V49 Dutch language */
.langs{white-space:nowrap}
.langs button{min-width:34px}


/* V50 Adopt + animal profiles */
.adopt-main,.animal-profile{background:#080808;min-height:calc(100vh - 82px)}
.adopt-intro{max-width:1280px;margin:0 auto;padding:100px 6vw 70px}
.adopt-intro h1{font-size:clamp(54px,7vw,92px);line-height:.96;margin:0 0 28px}
.adopt-intro p{max-width:760px;color:#cfcfcf;font-size:20px;line-height:1.65}
.animal-grid{max-width:1280px;margin:0 auto;padding:0 6vw 110px;display:grid;grid-template-columns:repeat(3,1fr);gap:38px}
.animal-card{min-width:0}.animal-photo{display:block;aspect-ratio:1/1;overflow:hidden}
.animal-photo img{width:100%;height:100%;object-fit:cover;object-position:center 30%;transition:transform .35s ease}
.animal-photo:hover img{transform:scale(1.025)}
.animal-card-copy{padding:24px 0}.animal-card h2{font-size:42px;margin:0 0 8px}.animal-card p{color:#bbb;font-size:17px;margin:0 0 24px}
.animal-button{display:inline-flex;padding:14px 22px;border-radius:6px;text-decoration:none;font-weight:800}
.animal-hero{max-width:1280px;margin:0 auto;padding:90px 6vw 85px;display:grid;grid-template-columns:1.05fr .95fr;gap:70px;align-items:center}
.animal-hero>img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:center 25%}
.animal-hero-copy h1{font-size:clamp(64px,8vw,112px);line-height:.9;margin:0 0 18px}
.animal-subtitle{color:#f26722!important;font-weight:800;font-size:20px!important}
.animal-hero-copy p{color:#cfcfcf;font-size:19px;line-height:1.7;max-width:560px}
.animal-story{max-width:1280px;margin:0 auto;padding:80px 6vw;display:grid;grid-template-columns:.8fr 1.2fr;gap:90px}
.animal-story h2,.animal-gallery h2{font-size:clamp(38px,5vw,64px);line-height:1.04;margin:0}
.animal-story-text p{color:#cfcfcf;font-size:18px;line-height:1.75;margin:0 0 22px}
.animal-story-text .age-note{color:#f26722;font-weight:800}
.animal-gallery{max-width:1280px;margin:0 auto;padding:70px 6vw 110px}
.profile-gallery{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:38px}
.profile-gallery img{width:100%;height:520px;object-fit:cover;object-position:center}
@media(max-width:760px){
 .adopt-intro{text-align:center;padding:65px 24px 50px}.adopt-intro h1{font-size:48px}.adopt-intro p{font-size:17px;margin-left:auto;margin-right:auto}
 .animal-grid{display:block;padding:0 24px 80px}.animal-card{text-align:center;margin-bottom:55px}.animal-card h2{font-size:38px}
 .animal-hero{padding:55px 24px 65px;display:flex;flex-direction:column;gap:38px;text-align:center}
 .animal-hero>img{aspect-ratio:1/1;object-position:center 25%}.animal-hero-copy h1{font-size:64px}.animal-hero-copy p{font-size:17px;margin-left:auto;margin-right:auto}
 .animal-story{padding:55px 24px;display:block;text-align:center}.animal-story>div:first-child{margin-bottom:32px}.animal-story h2{font-size:40px}
 .animal-story-text p{font-size:17px}.animal-gallery{text-align:center;padding:55px 24px 80px}.animal-gallery h2{font-size:40px}
 .profile-gallery{display:block}.profile-gallery img{height:auto;margin-bottom:18px}
}


/* V51 Texas photo presentation */
.animal-hero>img{
  aspect-ratio:auto;
  height:auto;
  max-height:760px;
  object-fit:contain;
  object-position:center;
}
.profile-gallery{
  align-items:start;
}
.profile-gallery img{
  width:100%;
  height:auto;
  max-height:none;
  object-fit:contain;
  object-position:center;
  background:transparent;
}
.animal-card .animal-photo img{
  object-position:center 25%;
}
@media(max-width:760px){
  .animal-hero>img{
    aspect-ratio:auto;
    height:auto;
    max-height:none;
    object-fit:contain;
  }
  .profile-gallery img{
    width:100%;
    height:auto;
    object-fit:contain;
  }
}


/* V52 Texas desktop gallery: orderly two-column presentation */
@media(min-width:761px){
  .animal-page .profile-gallery{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:28px;
    align-items:start;
  }
  .animal-page .profile-gallery img{
    width:100%;
    height:440px;
    object-fit:contain;
    object-position:center;
    margin:0;
  }
}


/* V53 Adopt card alignment: centre text and button beneath each animal photo */
.animal-card-copy{
  text-align:center;
}
.animal-card-copy .support-kicker,
.animal-card-copy h2,
.animal-card-copy p{
  text-align:center;
}
.animal-card-copy .animal-button{
  margin-left:auto;
  margin-right:auto;
}


/* V54 TorTor */
@media(min-width:761px){
  .animal-page .profile-gallery img:last-child:nth-child(odd){
    grid-column:1 / -1;
    max-width:calc(50% - 14px);
    justify-self:center;
  }
}


/* V60 Arkan: crop screenshot edges in-browser, no image files altered */
@media(min-width:761px){
  .arkan-page .animal-hero>img{
    width:100%;
    height:650px;
    object-fit:cover;
    object-position:center center;
  }
  .arkan-page .profile-gallery img{
    width:100%;
    height:440px;
    object-fit:cover;
    object-position:center center;
  }
}
@media(max-width:760px){
  .arkan-page .animal-hero>img{
    width:100%;
    aspect-ratio:1/1;
    height:auto;
    object-fit:cover;
    object-position:center center;
  }
  .arkan-page .profile-gallery img{
    width:100%;
    aspect-ratio:4/3;
    height:auto;
    object-fit:cover;
    object-position:center center;
  }
}


/* V62 Arkan: user-cropped source photos, displayed directly */
.arkan-page .arkan-hero-photo,
.arkan-page .arkan-photo{
  background-repeat:no-repeat;
  background-color:#111;
  background-size:cover;
  background-position:center center;
  overflow:hidden;
}
.arkan-page .arkan-hero-photo{background-image:url('assets/arkan-1.jpg');}
.arkan-page .arkan-photo.p2{background-image:url('assets/arkan-2.jpg');}
.arkan-page .arkan-photo.p3{background-image:url('assets/arkan-3.jpg');}
.arkan-page .arkan-photo.p4{background-image:url('assets/arkan-4.jpg');}
.arkan-page .arkan-photo.p5{background-image:url('assets/arkan-5.jpg');}
.arkan-page .arkan-photo.p6{background-image:url('assets/arkan-6.jpg');}
@media(min-width:761px){
  .arkan-page .arkan-hero-photo{width:100%;height:650px;}
  .arkan-page .arkan-gallery .arkan-photo{width:100%;height:440px;}
  .arkan-page .arkan-gallery .arkan-photo:last-child:nth-child(odd){grid-column:1/-1;max-width:calc(50% - 14px);justify-self:center;}
}
@media(max-width:760px){
  .arkan-page .arkan-hero-photo{width:100%;aspect-ratio:1/1;}
  .arkan-page .arkan-gallery .arkan-photo{width:100%;aspect-ratio:4/3;}
}

/* V67: tablet / iPad homepage layout */
@media (min-width:761px) and (max-width:1100px){
  header{
    height:68px;
    padding:0 24px;
    justify-content:space-between;
  }
  header .menu{display:block;}
  header nav{
    display:none;
    position:absolute;
    left:0;
    right:0;
    top:68px;
    background:#0b0b0b;
    padding:18px 28px 24px;
    border-top:1px solid #222;
    flex-direction:column;
    align-items:flex-start;
    gap:0;
  }
  header nav.open{display:flex;z-index:50;}
  header nav a{
    width:100%;
    padding:14px 0;
    font-size:17px;
    border-bottom:1px solid #242424;
  }
  .langs button{padding:9px 13px;}

  main.hero{
    min-height:0!important;
    height:auto!important;
    overflow:hidden;
    background:#080808;
    display:flex;
    flex-direction:column;
  }
  main.hero .mobile-logo-wrap{
    display:flex;
    justify-content:center;
    align-items:center;
    padding:18px 24px 10px;
    background:#080808;
    position:relative;
    z-index:8;
  }
  main.hero .mobile-logo{
    display:block;
    width:min(48vw,430px);
    max-height:205px;
    height:auto;
    object-fit:contain;
  }
  main.hero .content .logo{display:none;}

  main.hero .slides{
    position:relative!important;
    inset:auto!important;
    width:100%;
    height:500px;
    flex:none;
    overflow:hidden;
    background:#080808;
  }
  main.hero .slide{
    position:absolute;
    inset:0;
    background-size:cover;
    background-repeat:no-repeat;
  }
  main.hero .slide:nth-child(1){background-position:50% 42%!important;}
  main.hero .slide:nth-child(2){background-position:50% 38%!important;}
  main.hero .slide:nth-child(3){background-position:48% 42%!important;}
  main.hero .slide:nth-child(4){background-position:50% 38%!important;}
  main.hero .slides::before,
  main.hero .slides::after{
    content:"";
    position:absolute;
    z-index:5;
    left:0;
    right:0;
    height:58px;
    pointer-events:none;
  }
  main.hero .slides::before{
    top:0;
    background:linear-gradient(180deg,#080808 0%,rgba(8,8,8,.55) 32%,rgba(8,8,8,0) 100%);
  }
  main.hero .slides::after{
    bottom:0;
    background:linear-gradient(180deg,rgba(8,8,8,0) 0%,rgba(8,8,8,.58) 70%,#080808 100%);
  }
  main.hero .shade{display:none!important;}

  main.hero .content{
    position:relative!important;
    width:100%;
    min-height:0!important;
    height:auto!important;
    padding:8px 36px 24px;
    margin:0;
    background:#080808;
    display:flex;
    flex-direction:column;
    align-items:center;
    text-align:left;
  }
  main.hero h1{
    width:100%;
    max-width:720px;
    font-size:clamp(32px,4.8vw,46px);
    line-height:1.05;
    margin:0 0 20px;
    letter-spacing:-1px;
  }
  main.hero .actions{
    width:100%;
    max-width:720px;
    gap:12px;
  }
  main.hero .actions a{
    flex:1;
    min-width:0;
    padding:14px 18px;
    font-size:15px;
  }
  main.hero .counter{
    position:relative!important;
    right:auto!important;
    bottom:auto!important;
    margin:6px 36px 18px auto;
    font-size:12px;
  }
}