/* Home page composition, Ridek-style section order, Vizag Nightline tokens */

.topbar{background:#08080A;border-bottom:1px solid var(--line);font-size:13.5px;color:var(--muted)}
.topbar__in{display:flex;flex-wrap:wrap;align-items:center;gap:10px 28px;padding:9px var(--gut);justify-content:space-between}
.topbar b{color:var(--ink);font-weight:600}
.topbar a{color:var(--ink);font-weight:600}
.topbar a:hover{color:var(--accent)}
.topbar .tb{display:flex;align-items:center;gap:8px}
.topbar .tb small{color:var(--muted);font-size:11px;letter-spacing:.1em;text-transform:uppercase;display:block}
.topbar .tb-set{display:flex;flex-wrap:wrap;gap:10px 26px}

/* hero */
.hero2{position:relative;overflow:hidden;border-bottom:1px solid var(--line);background:linear-gradient(180deg,#101013 0%,#0C0C0D 100%)}
.hero2__slab{position:absolute;inset:0;z-index:0;background:var(--accent);clip-path:polygon(58% 0,100% 0,100% 100%,38% 100%);opacity:.9}
.hero2__art{position:absolute;right:0;top:0;bottom:0;width:52%;z-index:1;background:
  radial-gradient(120% 90% at 70% 30%, rgba(12,12,13,.25) 0%, rgba(12,12,13,.75) 70%),
  linear-gradient(200deg,#1C1A14 0%,#0E0E10 70%)}
.hero2__art::after{content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px);background-size:100% 44px}
.hero2__in{position:relative;z-index:2;padding:clamp(64px,8vw,124px) var(--gut);max-width:var(--wrap);margin:0 auto}
.hero2__copy{max-width:19ch}
.hero2 .lead{max-width:38ch;margin-top:var(--md)}
.hero2 .h1{margin-top:14px}
.artcap{position:absolute;z-index:3;right:clamp(20px,4vw,64px);bottom:clamp(20px,4vw,48px);max-width:24ch;text-align:right}
.artcap b{display:block;font-family:var(--display);font-size:clamp(18px,2vw,24px);line-height:1.1}
.artcap span{display:block;color:var(--muted);font-size:14px;margin-top:6px}

/* about */
.about{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(32px,5vw,72px);align-items:center}
.figblock{position:relative;aspect-ratio:4/3.4;border-radius:var(--r);background:linear-gradient(160deg,#1B1B1F 0%,#101012 100%);border:1px solid var(--line)}
.figblock::before{content:'';position:absolute;left:-14px;bottom:-14px;width:44%;height:38%;background:var(--accent);clip-path:polygon(0 0,100% 0,72% 100%,0 100%);z-index:-1}
.figblock span{position:absolute;left:20px;bottom:18px;color:var(--muted);font-size:13px;max-width:24ch}
.badgeround{position:absolute;right:-18px;top:-18px;width:126px;height:126px;border-radius:50%;background:var(--accent);color:#0C0C0D;display:grid;place-content:center;text-align:center;font-family:var(--display);font-weight:700;line-height:1.05;font-size:15px;padding:14px}
.ticklist{margin-top:24px;display:grid;gap:10px}
.ticklist li{padding-left:24px;position:relative;color:#D8D3C9}
.ticklist li::before{content:'';position:absolute;left:0;top:.55em;width:10px;height:2px;background:var(--accent)}

/* service cards */
.cards3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2vw,26px);margin-top:clamp(28px,3vw,44px)}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column}
.card__img{aspect-ratio:16/10;background:linear-gradient(150deg,#22201A 0%,#111113 100%);position:relative}
.card__img::after{content:'';position:absolute;left:0;bottom:0;width:56%;height:6px;background:var(--accent)}
.card__body{padding:22px 22px 24px;display:flex;flex-direction:column;gap:10px;flex:1}
.card__body p{color:var(--muted);font-size:15.5px}
.card__more{margin-top:auto;font-weight:700;font-size:15px;color:var(--accent)}

/* booking band */
.bookband{display:grid;grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);border-bottom:1px solid var(--line)}
.bookband__art{background:var(--accent);position:relative;min-height:320px}
.bookband__art::after{content:'';position:absolute;inset:0;background:radial-gradient(80% 70% at 40% 60%, rgba(12,12,13,.22) 0%, rgba(12,12,13,0) 70%)}
.bookband__art{display:grid;place-items:center;padding:clamp(28px,4vw,56px)}
.bookband__art b{position:static;color:#0C0C0D;font-family:var(--display);font-weight:700;font-size:clamp(26px,3vw,40px);line-height:1.06;letter-spacing:-0.015em;max-width:15ch;text-align:center;z-index:2}
.bookband__form{background:#111113;padding:clamp(32px,4vw,60px) var(--edge) clamp(32px,4vw,60px) clamp(32px,4vw,56px)}
.fgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:24px}
.fgrid label{display:block;font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:6px;font-weight:600}
.fgrid input,.fgrid select{width:100%;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);color:var(--ink);padding:13px 14px;font-size:15.5px}
.fgrid input::placeholder{color:#6E6A63}
.fgrid input:focus,.fgrid select:focus{outline:2px solid var(--accent);outline-offset:0;border-color:var(--accent)}
.fgrid .wide{grid-column:span 2}
.fsubmit{margin-top:18px;display:flex;flex-wrap:wrap;align-items:center;gap:14px}
.fsubmit small{color:var(--muted);font-size:13.5px}

/* why choose */
.why{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:stretch;border-bottom:1px solid var(--line)}
.why__l{padding:clamp(48px,6vw,96px) clamp(32px,4vw,64px) clamp(48px,6vw,96px) var(--edge)}
.why__r{background:var(--accent);color:#0C0C0D;padding:clamp(48px,6vw,96px) var(--edge) clamp(48px,6vw,96px) clamp(32px,4vw,64px)}
.why__r .h2{color:#0C0C0D}
.why__r ul{margin-top:28px;display:grid;gap:22px}
.why__r li{border-top:1px solid rgba(12,12,13,.22);padding-top:16px}
.why__r h3{font-family:var(--display);font-weight:700;font-size:19px}
.why__r p{font-size:15.5px;color:#2A2415;margin-top:4px;max-width:34ch}
.quote{border-left:2px solid var(--accent);padding-left:22px;margin-top:28px;font-size:18px;line-height:1.5;color:#D8D3C9;max-width:40ch}
.quote cite{display:block;margin-top:12px;font-style:normal;font-size:14px;color:var(--muted)}

/* call band */
.callband{position:relative;overflow:hidden;border-bottom:1px solid var(--line);background:linear-gradient(100deg,#141417 0%,#0C0C0D 60%)}
.callband__in{position:relative;z-index:2;max-width:var(--wrap);margin:0 auto;padding:clamp(56px,7vw,104px) var(--gut)}
.callband .h2{max-width:24ch}
.calltel{display:inline-flex;align-items:baseline;gap:14px;margin-top:28px}
.calltel b{font-family:var(--display);font-weight:700;font-size:clamp(30px,4vw,52px);color:var(--accent);letter-spacing:-0.02em;font-variant-numeric:tabular-nums}
.callband__slab{position:absolute;right:0;top:0;bottom:0;width:34%;background:var(--accent);clip-path:polygon(28% 0,100% 0,100% 100%,0 100%);opacity:.92;z-index:1}
.callband__slab span{position:absolute;right:clamp(20px,3vw,44px);bottom:clamp(20px,3vw,36px);color:#0C0C0D;font-weight:700;font-size:14px;text-align:right;max-width:18ch}

/* footer hours */
.foot-grid4{display:grid;grid-template-columns:1.1fr .8fr 1fr 1fr;gap:var(--lg)}
.hours{display:grid;gap:8px}
.hours div{display:flex;justify-content:space-between;gap:16px;border-bottom:1px solid var(--line);padding-bottom:7px}
.hours span:last-child{color:var(--ink)}

@media (max-width:1000px){
  .hero2__slab{clip-path:polygon(0 78%,100% 62%,100% 100%,0 100%)}
  .hero2__art{width:100%;top:auto;height:44%}
  .hero2__copy{max-width:none}
  .artcap{display:none}
  .about,.bookband,.why,.cards3,.foot-grid4{grid-template-columns:1fr}
  .badgeround{width:96px;height:96px;font-size:13px;right:8px;top:-14px}
  .why__l,.why__r{padding-left:var(--gut);padding-right:var(--gut)}
  .bookband__form{padding-left:var(--gut);padding-right:var(--gut)}
  .fgrid{grid-template-columns:1fr 1fr}
  .fgrid .wide{grid-column:span 2}
  .callband__slab{display:none}
}
@media (max-width:560px){
  .fgrid,.fgrid .wide{grid-template-columns:1fr;grid-column:auto}
  .topbar__in{gap:6px 18px}
}

/* hero, photo led */
.hero3{position:relative;overflow:hidden;border-bottom:1px solid var(--line);min-height:clamp(520px,80vh,800px);display:grid;align-items:center;background-color:#0C0C0D}
.hero3__img{position:absolute;inset:0;background-size:cover;background-position:center 42%;z-index:0}
.hero3__scrim{position:absolute;inset:0;z-index:1;background:linear-gradient(96deg,rgba(10,10,11,.96) 0%,rgba(10,10,11,.86) 38%,rgba(10,10,11,.42) 74%,rgba(10,10,11,.62) 100%)}
.hero3__wedge{position:absolute;right:0;bottom:0;width:36%;height:34%;z-index:2;background:var(--accent);clip-path:polygon(34% 0,100% 0,100% 100%,0 100%)}
.hero3__wedge b{position:absolute;right:clamp(18px,2.6vw,38px);bottom:clamp(16px,2.2vw,30px);color:#0C0C0D;font-family:var(--display);font-weight:700;font-size:clamp(15px,1.5vw,19px);line-height:1.15;text-align:right;max-width:17ch}
.hero3__in{position:relative;z-index:3;max-width:var(--wrap);margin:0 auto;padding:clamp(72px,9vw,120px) var(--gut)}
.hero3 .h1{max-width:17ch;margin-top:14px}
.hero3 .lead{max-width:36ch;margin-top:var(--md)}
.hero3 .hero__cta{margin-top:32px}

/* promise bar */
.promisebar{background:var(--accent);color:#0C0C0D}
.promisebar ul{max-width:var(--wrap);margin:0 auto;padding:18px var(--gut);display:grid;grid-template-columns:repeat(3,1fr);gap:12px 32px}
.promisebar li{font-family:var(--display);font-weight:700;font-size:clamp(15px,1.5vw,18px);line-height:1.2}
.promisebar li span{display:block;font-family:var(--body);font-weight:500;font-size:13.5px;color:#3A3116;margin-top:3px}

/* coverage list */
.coverage{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border-top:1px solid var(--line);margin-top:clamp(24px,3vw,40px)}
.coverage li{padding:26px 18px 22px 0;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.coverage li:last-child{border-right:0}
.coverage b{display:block;font-family:var(--display);font-weight:700;font-size:clamp(17px,1.7vw,21px);letter-spacing:-0.01em}
.coverage span{display:block;color:var(--muted);font-size:14px;margin-top:6px}

/* photo blocks */
.figblock.has-img{background-size:cover;background-position:center}
.figblock.has-img span{display:none}
.card__img.has-img{background-size:cover;background-position:center}

@media (max-width:1000px){
  .hero3__wedge{width:62%;height:24%}
  .promisebar ul,.coverage{grid-template-columns:1fr 1fr}
  .coverage li{border-right:0}
}
@media (max-width:560px){
  .promisebar ul,.coverage{grid-template-columns:1fr}
  .hero3__wedge{display:none}
}
@media (max-width:760px){
  .topbar__in > span{display:none}
  .topbar .tb-set{gap:4px 20px}
}

/* section 2, the Fairy Tails difference */
.diff{position:relative;border-bottom:1px solid var(--line);padding:clamp(56px,7vw,104px) 0 0}
.diff__top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.02fr);gap:clamp(28px,4vw,64px);align-items:center;max-width:var(--wrap);margin:0 auto;padding:0 var(--gut)}
.diff__sub{font-family:var(--display);font-weight:700;font-size:clamp(20px,2.2vw,27px);line-height:1.14;letter-spacing:-0.01em;color:var(--accent);margin-top:18px}
.diff__body{margin-top:20px;display:grid;gap:14px}
.diff__body p{color:#CFCAC1;max-width:46ch;font-size:16.5px;line-height:1.6}
.diff__figure{position:relative;margin-right:calc(-1 * var(--edge));border-radius:var(--r) 0 0 var(--r);overflow:hidden;aspect-ratio:3/2;border:1px solid var(--line);border-right:0}
.diff__figure img{width:100%;height:100%;object-fit:cover;display:block}
.diff__points{max-width:var(--wrap);margin:clamp(40px,5vw,72px) auto 0;padding:0 var(--gut);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--line)}
.diff__points li{padding:28px 26px 30px 0;border-right:1px solid var(--line)}
.diff__points li:last-child{border-right:0;padding-right:0}
.diff__points .n{display:block;font-family:var(--body);font-weight:700;font-size:12.5px;letter-spacing:.1em;color:var(--accent)}
.diff__points h3{font-family:var(--display);font-weight:700;font-size:clamp(18px,1.8vw,21px);line-height:1.15;margin-top:12px}
.diff__points p{color:var(--muted);font-size:15.5px;margin-top:8px;max-width:32ch}
.diff__cta{max-width:var(--wrap);margin:0 auto;padding:clamp(30px,3.5vw,44px) var(--gut) clamp(52px,6vw,88px)}
.linkarrow{display:inline-flex;align-items:center;gap:10px;font-family:var(--display);font-weight:700;font-size:clamp(17px,1.7vw,20px);color:var(--accent);border-bottom:1px solid rgba(216,166,43,.4);padding-bottom:6px}
.linkarrow:hover{color:#EBBE4A;border-bottom-color:#EBBE4A}
.linkarrow span{transition:transform .2s ease}
.linkarrow:hover span{transform:translateX(4px)}
@media (max-width:1000px){
  .diff__top{grid-template-columns:1fr}
  .diff__figure{margin-right:calc(-1 * var(--gut));margin-left:calc(-1 * var(--gut));border-radius:0;border-left:0}
  .diff__points{grid-template-columns:1fr}
  .diff__points li{border-right:0;border-bottom:1px solid var(--line);padding-right:0}
  .diff__points li:last-child{border-bottom:0}
}

/* section 3, services */
.svc__head{max-width:var(--wrap);margin:0 auto;padding:0 var(--gut);max-width:min(var(--wrap),100%)}
.svc__head .lead{margin-top:16px}
.svcrow{max-width:var(--wrap);margin:clamp(32px,4vw,56px) auto 0;padding:0 var(--gut);display:grid;gap:clamp(18px,2.2vw,30px);grid-template-columns:repeat(3,minmax(0,1fr))}
.svc{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;opacity:0;transform:translateY(22px);transition:transform .6s cubic-bezier(.2,.7,.3,1),opacity .6s ease,border-color .3s ease}
.svc.in{opacity:1;transform:none}
.svc:nth-child(2){transition-delay:.12s}
.svc:nth-child(3){transition-delay:.24s}
.svc:hover{border-color:rgba(216,166,43,.5)}
.svc__media{position:relative;aspect-ratio:16/11;overflow:hidden}
.svc__media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .8s cubic-bezier(.2,.7,.3,1)}
.svc:hover .svc__media img{transform:scale(1.06)}
.svc__media::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,8,9,0) 40%,rgba(8,8,9,.72) 100%)}
.svc__n{position:absolute;left:16px;top:14px;z-index:2;font-family:var(--body);font-weight:700;font-size:12px;letter-spacing:.1em;color:var(--accent);background:rgba(8,8,9,.72);border:1px solid rgba(216,166,43,.35);border-radius:var(--r);padding:6px 10px}
.svc__in{padding:22px 22px 26px;display:flex;flex-direction:column;gap:10px;flex:1}
.svc__in h3{font-family:var(--display);font-weight:700;font-size:clamp(20px,2vw,24px);line-height:1.12;letter-spacing:-0.01em}
.svc__tag{color:var(--accent);font-weight:600;font-size:15.5px;line-height:1.35}
.svc__in p.svc__txt{color:var(--muted);font-size:15.5px;line-height:1.55}
.svc__link{margin-top:auto;padding-top:8px;display:inline-flex;align-items:center;gap:9px;font-family:var(--display);font-weight:700;font-size:16px;color:var(--accent)}
.svc__link span{transition:transform .2s ease}
.svc:hover .svc__link span{transform:translateX(5px)}
@media (prefers-reduced-motion:reduce){.svc{opacity:1;transform:none;transition:none}.svc__media img{transition:none}}
@media (max-width:1000px){.svcrow{grid-template-columns:1fr}.svc:nth-child(2),.svc:nth-child(3){transition-delay:0s}}

/* section 5, why Fairy Tails */
.why__sub{font-family:var(--display);font-weight:700;font-size:clamp(20px,2.1vw,26px);line-height:1.14;letter-spacing:-0.01em;color:var(--accent);margin-top:14px}
.whygrid{display:grid;grid-template-columns:1fr 1fr;gap:26px 30px;margin-top:30px}
.whygrid li{border-top:1px solid rgba(12,12,13,.25);padding-top:14px}
.whygrid .n{display:block;font-family:var(--body);font-weight:700;font-size:12px;letter-spacing:.1em;color:#5A4A12}
.whygrid h3{font-family:var(--display);font-weight:700;font-size:clamp(17px,1.7vw,20px);line-height:1.14;margin-top:8px}
.whygrid p{font-size:15px;line-height:1.5;color:#2A2415;margin-top:5px;max-width:30ch}
.btn--dark{background:#0C0C0D;color:var(--ink);border-color:#0C0C0D}
.btn--dark:hover{background:#17171A;color:var(--accent)}
@media (max-width:640px){.whygrid{grid-template-columns:1fr;gap:20px}}

/* section 6, how it works */
.hiw{border-bottom:1px solid var(--line);padding:clamp(56px,7vw,100px) 0}
.hiw__in{max-width:var(--wrap);margin:0 auto;padding:0 var(--gut)}
.hiw__sub{font-family:var(--display);font-weight:700;font-size:clamp(20px,2.1vw,26px);line-height:1.14;letter-spacing:-0.01em;color:var(--accent);margin-top:12px}
.hiwsteps{margin-top:clamp(32px,4vw,56px);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-top:1px solid var(--line);counter-reset:hiw}
.hiwstep{position:relative;padding:32px 30px 34px 0;border-right:1px solid var(--line);opacity:0;transform:translateY(20px);transition:opacity .6s ease,transform .6s cubic-bezier(.2,.7,.3,1)}
.hiwstep.in{opacity:1;transform:none}
.hiwstep:nth-child(2){transition-delay:.14s}
.hiwstep:nth-child(3){transition-delay:.28s}
.hiwstep:last-child{border-right:0;padding-right:0}
.hiwstep::before{content:'';position:absolute;top:-1px;left:0;width:0;height:2px;background:var(--accent);transition:width .7s cubic-bezier(.25,.8,.3,1) .2s}
.hiwstep.in::before{width:64px}
.hiwstep .n{display:block;font-family:var(--body);font-weight:700;font-size:12.5px;letter-spacing:.1em;color:var(--accent)}
.hiwstep h3{font-family:var(--display);font-weight:700;font-size:clamp(19px,1.9vw,23px);line-height:1.14;letter-spacing:-0.01em;margin-top:14px}
.hiwstep p{color:var(--muted);font-size:15.5px;line-height:1.55;margin-top:9px;max-width:30ch}
@media (prefers-reduced-motion:reduce){.hiwstep{opacity:1;transform:none;transition:none}.hiwstep.in::before{transition:none}}
@media (max-width:900px){
  .hiwsteps{grid-template-columns:1fr}
  .hiwstep{border-right:0;border-bottom:1px solid var(--line);padding-right:0;padding-bottom:26px}
  .hiwstep:last-child{border-bottom:0}
  .hiwstep:nth-child(2),.hiwstep:nth-child(3){transition-delay:0s}
}