/* ═══════════════════════════════════════════════════
   NYLOR — Stylesheet (no Tailwind needed)
   Performance + Accessibility optimized
═══════════════════════════════════════════════════ */

/* ── TOKENS — improved contrast ─────────────── */
:root{
  --bg:#FFFFFF;
  --bg2:#FFF8F0;
  --bg3:#FEF3EC;
  --coral:#FF6B6B;
  --coral-text:#C53030;      /* AA-compliant on white for small text */
  --orange:#FF8E53;
  --orange-text:#C2410C;     /* AA-compliant darker orange */
  --teal:#14B8A6;
  --teal-text:#0F766E;       /* AA-compliant darker teal */
  --teal2:#0EA5E9;
  --yellow:#FCD34D;
  --yellow-text:#A16207;     /* AA-compliant darker amber */
  --purple:#A78BFA;
  --purple-text:#6D28D9;     /* AA-compliant darker purple */
  --pink:#F472B6;
  --dark:#0F172A;
  --dark2:#1E293B;
  --muted:#475569;           /* slate-600 — 7.2:1 on white (AAA) */
  --muted2:#94A3B8;          /* placeholders only */
  --border:#E5E7EB;
  --border2:#F1F5F9;
  --shadow-sm:0 4px 14px rgba(15,23,42,.06);
  --shadow-md:0 12px 32px rgba(15,23,42,.08);
  --shadow-lg:0 24px 64px rgba(15,23,42,.12);
  --shadow-coral:0 20px 50px rgba(255,107,107,.25);
  --ease:cubic-bezier(.76,0,.24,1);
}

/* ── RESET ──────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{background:var(--bg);color:var(--dark);font-family:'DM Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;overflow-x:hidden;-webkit-font-smoothing:antialiased;font-size:16px;line-height:1.5;}
h1,h2,h3,h4,h5,h6{font-family:'Space Grotesk','DM Sans',sans-serif;color:var(--dark);font-weight:700;line-height:1.2;}
img,svg,video{display:block;max-width:100%;height:auto;}
button{font:inherit;color:inherit;background:transparent;border:none;}
a{color:inherit;text-decoration:none;}
input,select,textarea{font:inherit;color:inherit;}
ul{list-style:none;}
::selection{background:rgba(255,107,107,.25);}
::-webkit-scrollbar{width:8px;}
::-webkit-scrollbar-track{background:var(--bg2);}
::-webkit-scrollbar-thumb{background:linear-gradient(var(--coral),var(--orange));border-radius:4px;}

/* ── CURSOR RESTORE ────────────────────────── */
html, body { cursor: auto !important; }
a, button { cursor: pointer !important; }
input, textarea { cursor: text !important; }

/* ── REDUCED MOTION ─────────────────────────── */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
    scroll-behavior:auto!important;
  }
  .blob,#cd,#cr,#mglow,#loader,#ptrans{display:none!important;}
  .rv .badge,.rv-l .badge,.rv-r .badge{transform:none;opacity:1;}
  .rv-stagger{opacity:1;transform:none;}
  #mm.o li{opacity:1;transform:none;animation:none;}
}

/* ════════════════════════════════════════════════
   UTILITIES (Tailwind-compatible names)
═════════════════════════════════════════════════ */

/* Containers */
.max-w-7xl{max-width:80rem;}
.max-w-5xl{max-width:64rem;}
.max-w-3xl{max-width:48rem;}
.max-w-2xl{max-width:42rem;}
.max-w-xl{max-width:36rem;}
.max-w-md{max-width:28rem;}
.mx-auto{margin-inline:auto;}
.w-full{width:100%;}
.h-full{height:100%;}

/* Display */
.block{display:block;}
.inline-block{display:inline-block;}
.flex{display:flex;}
.inline-flex{display:inline-flex;}
.grid{display:grid;}
.hidden{display:none;}

/* Position */
.relative{position:relative;}
.absolute{position:absolute;}
.fixed{position:fixed;}
.inset-0{inset:0;}
.inset-x-0{left:0;right:0;}
.top-0{top:0;}
.right-0{right:0;}
.bottom-0{bottom:0;}
.left-0{left:0;}
.z-10{z-index:10;}
.z-40{z-index:40;}
.z-50{z-index:50;}

/* Flex */
.flex-col{flex-direction:column;}
.flex-row{flex-direction:row;}
.flex-wrap{flex-wrap:wrap;}
.flex-1{flex:1 1 0%;}
.flex-shrink-0{flex-shrink:0;}
.items-center{align-items:center;}
.items-start{align-items:flex-start;}
.items-end{align-items:flex-end;}
.items-baseline{align-items:baseline;}
.justify-center{justify-content:center;}
.justify-between{justify-content:space-between;}
.justify-end{justify-content:flex-end;}

/* Grid */
.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr));}
.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr));}
.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr));}
.grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr));}
.col-span-1{grid-column:span 1/span 1;}
.col-span-2{grid-column:span 2/span 2;}

/* Gap */
.gap-1{gap:.25rem;}.gap-2{gap:.5rem;}.gap-3{gap:.75rem;}.gap-4{gap:1rem;}
.gap-5{gap:1.25rem;}.gap-6{gap:1.5rem;}.gap-8{gap:2rem;}.gap-10{gap:2.5rem;}
.gap-12{gap:3rem;}.gap-16{gap:4rem;}
.gap-1\.5{gap:.375rem;}.gap-2\.5{gap:.625rem;}

/* Padding */
.p-1{padding:.25rem;}.p-2{padding:.5rem;}.p-3{padding:.75rem;}
.p-4{padding:1rem;}.p-5{padding:1.25rem;}.p-6{padding:1.5rem;}
.p-8{padding:2rem;}
.px-1{padding-inline:.25rem;}.px-2{padding-inline:.5rem;}.px-3{padding-inline:.75rem;}
.px-4{padding-inline:1rem;}.px-5{padding-inline:1.25rem;}.px-6{padding-inline:1.5rem;}
.px-8{padding-inline:2rem;}
.py-1{padding-block:.25rem;}.py-2{padding-block:.5rem;}.py-2\.5{padding-block:.625rem;}
.py-3{padding-block:.75rem;}.py-4{padding-block:1rem;}.py-5{padding-block:1.25rem;}
.py-6{padding-block:1.5rem;}.py-8{padding-block:2rem;}.py-10{padding-block:2.5rem;}
.py-12{padding-block:3rem;}.py-16{padding-block:4rem;}.py-20{padding-block:5rem;}
.py-28{padding-block:7rem;}
.pt-1{padding-top:.25rem;}.pt-2{padding-top:.5rem;}.pt-12{padding-top:3rem;}
.pt-16{padding-top:4rem;}.pt-20{padding-top:5rem;}
.pb-1{padding-bottom:.25rem;}.pb-2{padding-bottom:.5rem;}.pb-4{padding-bottom:1rem;}
.pb-5{padding-bottom:1.25rem;}.pb-20{padding-bottom:5rem;}.pb-28{padding-bottom:7rem;}
.pl-6{padding-left:1.5rem;}.pl-10{padding-left:2.5rem;}.pr-6{padding-right:1.5rem;}.pr-10{padding-right:2.5rem;}

/* Margin */
.m-0{margin:0;}
.mt-1{margin-top:.25rem;}.mt-1\.5{margin-top:.375rem;}.mt-2{margin-top:.5rem;}
.mt-3{margin-top:.75rem;}.mt-4{margin-top:1rem;}.mt-5{margin-top:1.25rem;}
.mt-6{margin-top:1.5rem;}.mt-7{margin-top:1.75rem;}.mt-8{margin-top:2rem;}
.mt-10{margin-top:2.5rem;}.mt-12{margin-top:3rem;}.mt-14{margin-top:3.5rem;}
.mt-16{margin-top:4rem;}.mt-20{margin-top:5rem;}
.mb-1{margin-bottom:.25rem;}.mb-2{margin-bottom:.5rem;}.mb-3{margin-bottom:.75rem;}
.mb-4{margin-bottom:1rem;}.mb-5{margin-bottom:1.25rem;}.mb-6{margin-bottom:1.5rem;}
.mb-7{margin-bottom:1.75rem;}.mb-8{margin-bottom:2rem;}.mb-10{margin-bottom:2.5rem;}
.mb-12{margin-bottom:3rem;}.mb-14{margin-bottom:3.5rem;}.mb-16{margin-bottom:4rem;}
.ml-0\.5{margin-left:.125rem;}.ml-auto{margin-left:auto;}.mx-1\.5{margin-inline:.375rem;}

/* Space (between children) */
.space-y-1>*+*{margin-top:.25rem;}
.space-y-2>*+*{margin-top:.5rem;}
.space-y-2\.5>*+*{margin-top:.625rem;}
.space-y-3>*+*{margin-top:.75rem;}
.space-y-4>*+*{margin-top:1rem;}
.space-y-5>*+*{margin-top:1.25rem;}

/* Sizing (w/h) */
.w-4{width:1rem;}.w-5{width:1.25rem;}.w-6{width:1.5rem;}.w-8{width:2rem;}
.w-12{width:3rem;}.w-16{width:4rem;}.w-20{width:5rem;}.w-24{width:6rem;}
.w-px{width:1px;}
.h-4{height:1rem;}.h-5{height:1.25rem;}.h-6{height:1.5rem;}.h-7{height:1.75rem;}
.h-8{height:2rem;}.h-10{height:2.5rem;}.h-12{height:3rem;}.h-16{height:4rem;}
.h-20{height:5rem;}.h-px{height:1px;}

/* Typography */
.text-xs{font-size:.75rem;line-height:1rem;}
.text-sm{font-size:.875rem;line-height:1.25rem;}
.text-base{font-size:1rem;line-height:1.5rem;}
.text-lg{font-size:1.125rem;line-height:1.75rem;}
.text-xl{font-size:1.25rem;line-height:1.75rem;}
.text-2xl{font-size:1.5rem;line-height:2rem;}
.text-3xl{font-size:1.875rem;line-height:2.25rem;}
.text-4xl{font-size:2.25rem;line-height:2.5rem;}
.text-5xl{font-size:3rem;line-height:1;}
.text-6xl{font-size:3.75rem;line-height:1;}
.text-7xl{font-size:4.5rem;line-height:1;}
.text-\[10px\]{font-size:10px;}
.text-\[15px\]{font-size:15px;}

.font-bold{font-weight:700;}
.font-semibold{font-weight:600;}
.font-medium{font-weight:500;}

.leading-tight{line-height:1.25;}
.leading-relaxed{line-height:1.625;}

.tracking-wide{letter-spacing:.025em;}
.tracking-widest{letter-spacing:.1em;}
.tracking-tight{letter-spacing:-.025em;}

.text-center{text-align:center;}
.text-left{text-align:left;}
.text-right{text-align:right;}

.uppercase{text-transform:uppercase;}
.not-italic{font-style:normal;}
.whitespace-nowrap{white-space:nowrap;}
.resize-none{resize:none;}

/* Brand fonts */
.font-g{font-family:'Space Grotesk','DM Sans',sans-serif;}
.font-s{font-family:'DM Sans',sans-serif;}
.font-script{font-family:'Dancing Script',cursive;}

/* Colors — text */
.text-white{color:#fff;}
.text-\[var\(--coral\)\]{color:var(--coral-text);}      /* upgraded contrast */
.text-\[var\(--orange\)\]{color:var(--orange-text);}
.text-\[var\(--teal\)\]{color:var(--teal-text);}
.text-\[var\(--purple\)\]{color:var(--purple-text);}
.text-\[var\(--yellow\)\]{color:var(--yellow-text);}
.text-\[var\(--muted\)\]{color:var(--muted);}
.text-\[var\(--dark\)\]{color:var(--dark);}
.text-\[var\(--dark2\)\]{color:var(--dark2);}
.text-\[var\(--blue2\)\]{color:#0369A1;}
.text-\[var\(--gold\)\]{color:var(--yellow-text);}
.text-\[\#D97706\]{color:#A16207;}
.text-\[\#B45309\]{color:#92400E;}

/* Colors — bg */
.bg-white{background-color:#fff;}
.bg-\[var\(--bg2\)\]{background-color:var(--bg2);}

/* Borders */
.border{border-width:1px;border-style:solid;border-color:var(--border);}
.border-t{border-top-width:1px;border-top-style:solid;border-top-color:var(--border);}
.border-b{border-bottom-width:1px;border-bottom-style:solid;border-bottom-color:var(--border);}
.border-\[var\(--border\)\]{border-color:var(--border);}
.border-white\/40{border-color:rgba(255,255,255,.4);}
.border-2{border-width:2px;}

.rounded{border-radius:.25rem;}
.rounded-lg{border-radius:.5rem;}
.rounded-xl{border-radius:.75rem;}
.rounded-2xl{border-radius:1rem;}
.rounded-3xl{border-radius:1.5rem;}
.rounded-full{border-radius:9999px;}

/* Effects */
.shadow-md{box-shadow:var(--shadow-md);}
.shadow-lg{box-shadow:var(--shadow-lg);}
.shadow-2xl{box-shadow:0 25px 50px -12px rgba(0,0,0,.25);}

.overflow-hidden{overflow:hidden;}
.overflow-x-hidden{overflow-x:hidden;}
.overflow-x-auto{overflow-x:auto;}

.transition-all{transition:all .3s ease;}
.transition-colors{transition:color .25s ease,background-color .25s ease,border-color .25s ease;}
.duration-300{transition-duration:.3s;}

.opacity-50{opacity:.5;}
.opacity-40{opacity:.4;}

/* Transform — composited */
.-translate-x-1\/2{transform:translateX(-50%);}
.-translate-y-1\/2{transform:translateY(-50%);}

/* Hover & group */
.hover\:bg-white\/10:hover{background-color:rgba(255,255,255,.1);}
.hover\:bg-white\/5:hover{background-color:rgba(255,255,255,.05);}
.hover\:text-\[var\(--coral\)\]:hover{color:var(--coral-text);}
.hover\:text-\[var\(--teal\)\]:hover{color:var(--teal-text);}
.hover\:text-white:hover{color:#fff;}
.hover\:text-\[var\(--dark\)\]:hover{color:var(--dark);}
.hover\:border-\[var\(--coral\)\]:hover{border-color:var(--coral);}
.hover\:border-\[var\(--teal\)\]:hover{border-color:var(--teal);}
.hover\:shadow-md:hover{box-shadow:var(--shadow-md);}
.hover\:underline:hover{text-decoration:underline;}
.hover\:translate-x-1{transition:transform .3s;}
.group:hover .group-hover\:text-\[var\(--coral\)\]{color:var(--coral-text);}
.group:hover .group-hover\:text-\[var\(--teal\)\]{color:var(--teal-text);}
.group:hover .group-hover\:translate-x-1{transform:translateX(.25rem);}

/* Responsive — sm: */
@media (min-width: 640px){
  .sm\:col-span-2{grid-column:span 2/span 2;}
  .sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr));}
  .sm\:flex-row{flex-direction:row;}
  .sm\:items-center{align-items:center;}
  .sm\:justify-between{justify-content:space-between;}
  .sm\:text-base{font-size:1rem;line-height:1.5rem;}
}

/* Responsive — md: */
@media (min-width: 768px){
  .md\:flex{display:flex;}
  .md\:block{display:block;}
  .md\:hidden{display:none;}
  .md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr));}
  .md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr));}
  .md\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr));}
  .md\:text-xl{font-size:1.25rem;line-height:1.75rem;}
  .md\:text-2xl{font-size:1.5rem;line-height:2rem;}
  .md\:text-3xl{font-size:1.875rem;}
  .md\:text-4xl{font-size:2.25rem;}
  .md\:text-5xl{font-size:3rem;line-height:1.05;}
  .md\:text-6xl{font-size:3.75rem;line-height:1;}
  .md\:text-7xl{font-size:4.5rem;line-height:1;}
  .md\:flex-row{flex-direction:row;}
  .md\:items-end{align-items:flex-end;}
  .md\:justify-between{justify-content:space-between;}
  .md\:gap-4{gap:1rem;}
  .md\:pr-10{padding-right:2.5rem;}
  .md\:pl-10{padding-left:2.5rem;}
  .md\:px-10{padding-inline:2.5rem;}
}

/* Responsive — lg: */
@media (min-width: 1024px){
  .lg\:flex{display:flex;}
  .lg\:block{display:block;}
  .lg\:inline-flex{display:inline-flex;}
  .lg\:hidden{display:none;}
  .lg\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr));}
  .lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr));}
  .lg\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr));}
  .lg\:grid-cols-12{grid-template-columns:repeat(12,minmax(0,1fr));}
  .lg\:col-span-1{grid-column:span 1/span 1;}
  .lg\:col-span-5{grid-column:span 5/span 5;}
  .lg\:col-span-7{grid-column:span 7/span 7;}
  .lg\:gap-8{gap:2rem;}
}

.min-w-\[100px\]{min-width:100px;}
.min-w-\[120px\]{min-width:120px;}

/* ════════════════════════════════════════════════
   PERFORMANCE — animations only on transform/opacity
═════════════════════════════════════════════════ */

/* ── PAGE LOADER ────────────────────────────── */
#loader{
  position:fixed;inset:0;z-index:99999;
  background:#FFFFFF;
  display:flex;align-items:center;justify-content:center;
  opacity:1;
  transition:opacity .5s ease;
  will-change:opacity;
}
#loader.gone{opacity:0;pointer-events:none;}
.loader-mark{display:flex;flex-direction:column;align-items:center;gap:20px;}
.loader-svg{width:64px;height:64px;animation:loaderSpin 2s ease-in-out infinite;will-change:transform;}
.loader-svg rect,.loader-svg path{stroke-dasharray:200;stroke-dashoffset:200;animation:loaderDraw 1.4s ease forwards;}
.loader-svg path{stroke-dasharray:80;stroke-dashoffset:80;animation-delay:.3s;}
@keyframes loaderDraw{to{stroke-dashoffset:0;}}
@keyframes loaderSpin{0%,100%{transform:rotate(0);}50%{transform:rotate(8deg);}}
.loader-text{
  font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:14px;
  letter-spacing:.4em;text-transform:uppercase;color:var(--muted);
  display:flex;gap:3px;
}
.loader-text span{display:inline-block;will-change:transform;animation:loaderLet 1.2s ease infinite;}
.loader-text span:nth-child(1){animation-delay:0s;}
.loader-text span:nth-child(2){animation-delay:.08s;}
.loader-text span:nth-child(3){animation-delay:.16s;}
.loader-text span:nth-child(4){animation-delay:.24s;}
.loader-text span:nth-child(5){animation-delay:.32s;}
@keyframes loaderLet{0%,100%{transform:translateY(0);}50%{transform:translateY(-6px);}}

/* ── PAGE TRANSITION OVERLAY ────────────────── */
#ptrans{
  position:fixed;inset:0;z-index:9998;
  background:linear-gradient(135deg,var(--coral),var(--orange));
  transform:translateY(100%);
  transition:transform .58s var(--ease);
  pointer-events:none;
  will-change:transform;
}
#ptrans.show{transform:translateY(0);}
#ptrans.hide{transform:translateY(-100%);transition:transform .58s var(--ease) .1s;}
#ptrans-text{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-family:'Space Grotesk',sans-serif;font-weight:700;color:#fff;
  font-size:48px;letter-spacing:-.02em;opacity:0;transition:opacity .3s ease .15s;
  will-change:opacity;
}
#ptrans.show #ptrans-text{opacity:1;}

/* ── PROGRESS BAR ───────────────────────────── */
#prog{
  position:fixed;top:0;left:0;height:3px;width:0%;
  background:linear-gradient(90deg,var(--coral),var(--orange),var(--yellow));
  z-index:9997;transform-origin:0 50%;
  will-change:transform;
}


/* ── MOUSE GLOW ─────────────────────────────── */
#mglow{
  position:fixed;width:480px;height:480px;border-radius:50%;
  background:radial-gradient(circle,rgba(255,107,107,.06) 0%,transparent 70%);
  pointer-events:none;z-index:0;
  transform:translate3d(-50%,-50%,0);
  will-change:transform;
}

/* ── BG ORBS — smaller blur for perf ─────────── */
.blob{position:fixed;border-radius:50%;filter:blur(60px);pointer-events:none;z-index:0;will-change:transform;}
.b1{width:480px;height:480px;background:rgba(255,107,107,.16);top:-120px;left:-100px;animation:bf1 24s ease-in-out infinite;}
.b2{width:400px;height:400px;background:rgba(20,184,166,.13);top:30%;right:-100px;animation:bf2 28s ease-in-out infinite;}
.b3{width:360px;height:360px;background:rgba(252,211,77,.15);bottom:0;left:30%;animation:bf3 22s ease-in-out infinite;}
@keyframes bf1{0%,100%{transform:translate3d(0,0,0);}33%{transform:translate3d(80px,-50px,0);}66%{transform:translate3d(-40px,60px,0);}}
@keyframes bf2{0%,100%{transform:translate3d(0,0,0);}40%{transform:translate3d(-60px,40px,0);}75%{transform:translate3d(60px,-30px,0);}}
@keyframes bf3{0%,100%{transform:translate3d(0,0,0);}50%{transform:translate3d(40px,-50px,0);}}

/* ── DOT PATTERN ────────────────────────────── */
#dots{position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.4;
  background-image:radial-gradient(circle,rgba(15,23,42,.08) 1px,transparent 1px);
  background-size:32px 32px;
  mask-image:radial-gradient(ellipse at 50% 30%,black 30%,transparent 80%);
  -webkit-mask-image:radial-gradient(ellipse at 50% 30%,black 30%,transparent 80%);}

/* ── NAV ────────────────────────────────────── */
#nav{position:fixed;left:0;right:0;top:0;z-index:50;transition:transform .35s ease,background .3s,box-shadow .3s;will-change:transform;}
#nav.sc{background:rgba(255,255,255,.85);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid var(--border);box-shadow:var(--shadow-sm);}
#nav.up{transform:translateY(-100%);}
.nav-wrap{max-width:80rem;margin:0 auto;padding:16px 24px;display:flex;align-items:center;justify-content:space-between;}
.nav-logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--dark);}
.nav-logo span{font-family:'Space Grotesk',sans-serif;font-size:20px;font-weight:700;}
.nav-links{display:none;align-items:center;gap:32px;}
@media (min-width:1024px){.nav-links{display:flex;}}
.nl{position:relative;color:var(--muted);text-decoration:none;font-size:14px;font-weight:500;transition:color .2s;padding:6px 2px;}
.nl:hover,.nl.active{color:var(--dark);}
.nl::after{content:'';position:absolute;bottom:0;left:0;width:0;height:2px;background:linear-gradient(90deg,var(--coral),var(--orange));border-radius:2px;transition:width .35s var(--ease);}
.nl:hover::after,.nl.active::after{width:100%;}

/* ── MOBILE MENU ────────────────────────────── */
#mm{position:fixed;top:0;right:0;bottom:0;width:300px;background:#fff;border-left:1px solid var(--border);z-index:50;padding:32px;display:flex;flex-direction:column;box-shadow:-20px 0 60px rgba(0,0,0,.1);transform:translate3d(100%,0,0);transition:transform .42s var(--ease);will-change:transform;}
#mm.o{transform:translate3d(0,0,0);}
#mo{position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:40;opacity:0;pointer-events:none;transition:opacity .35s;}
#mo.o{opacity:1;pointer-events:auto;}
.ham{display:flex;flex-direction:column;gap:6px;padding:8px;background:transparent;border:none;cursor:pointer;}
@media(min-width:1024px){.ham{display:none;}}
.ham span{display:block;height:2px;background:var(--dark);border-radius:2px;}
.ham span:nth-child(1){width:24px;}
.ham span:nth-child(2){width:24px;}
.ham span:nth-child(3){width:16px;}

/* ── GRADIENTS ──────────────────────────────── */
.gt{background:linear-gradient(135deg,var(--coral),var(--orange));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;color:transparent;}
.gt2{background:linear-gradient(135deg,var(--teal),var(--teal2));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;color:transparent;}
.gt3{background:linear-gradient(135deg,var(--coral),var(--purple));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;color:transparent;}

/* ── BADGE ──────────────────────────────────── */
.badge{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border-radius:50px;background:linear-gradient(135deg,rgba(255,107,107,.14),rgba(255,142,83,.1));border:1px solid rgba(197,48,48,.3);color:var(--coral-text);font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;}
.badge::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--coral);flex-shrink:0;animation:pulse 2s ease-in-out infinite;will-change:opacity;}
.badge-teal{background:linear-gradient(135deg,rgba(15,118,110,.12),rgba(14,165,233,.08));border-color:rgba(15,118,110,.35);color:var(--teal-text);}
.badge-teal::before{background:var(--teal);}
.badge-yellow{background:linear-gradient(135deg,rgba(252,211,77,.22),rgba(252,211,77,.12));border-color:rgba(180,83,9,.4);color:#92400E;}
.badge-yellow::before{background:#F59E0B;}
.badge-purple{background:linear-gradient(135deg,rgba(109,40,217,.12),rgba(244,114,182,.08));border-color:rgba(109,40,217,.3);color:var(--purple-text);}
.badge-purple::before{background:var(--purple);}
@keyframes pulse{0%,100%{opacity:1;}50%{opacity:.55;}}

/* ── BUTTONS ────────────────────────────────── */
.btn-c{position:relative;overflow:hidden;background:linear-gradient(135deg,var(--coral),var(--orange));color:#fff;font-weight:700;border-radius:50px;transition:box-shadow .3s,transform .2s;box-shadow:var(--shadow-coral);text-decoration:none;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;}
.btn-c:hover{transform:translateY(-2px);box-shadow:0 25px 60px rgba(255,107,107,.4);}
.btn-c>span{position:relative;z-index:1;}
.btn-c::after{content:'';position:absolute;inset:0;background:linear-gradient(135deg,var(--orange),var(--coral));opacity:0;transition:opacity .35s;}
.btn-c:hover::after{opacity:1;}

.btn-d{border:1.5px solid var(--dark);color:var(--dark);font-weight:600;border-radius:50px;background:transparent;transition:background .3s,color .3s,transform .2s;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:8px;}
.btn-d:hover{background:var(--dark);color:#fff;transform:translateY(-2px);}

.btn-w{background:#fff;color:var(--coral-text);font-weight:700;border-radius:50px;transition:transform .3s,box-shadow .3s;box-shadow:var(--shadow-md);text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:8px;}
.btn-w:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg);}

/* ── CARDS ──────────────────────────────────── */
.card{background:#fff;border:1px solid var(--border);border-radius:24px;transition:transform .35s,box-shadow .35s,border-color .35s;will-change:transform;}
.card:hover{transform:translateY(-6px);box-shadow:var(--shadow-md);border-color:rgba(255,107,107,.3);}

.svc{position:relative;background:#fff;border:1px solid var(--border);border-radius:24px;transition:box-shadow .4s,border-color .4s;transform-style:preserve-3d;overflow:hidden;will-change:transform;}
.svc:hover{border-color:transparent;box-shadow:var(--shadow-md);}
.svc::before{content:'';position:absolute;inset:-1px;border-radius:24px;background:linear-gradient(135deg,var(--coral),var(--orange));opacity:0;transition:opacity .4s;z-index:-1;}
.svc:hover::before{opacity:1;}
.svc-inner{background:#fff;border-radius:23px;padding:32px;}

/* ── ICON WRAP ──────────────────────────────── */
.iw{width:56px;height:56px;border-radius:16px;display:flex;align-items:center;justify-content:center;transition:transform .35s var(--ease);will-change:transform;}
.svc:hover .iw,.card:hover .iw{transform:scale(1.08) rotate(-6deg);}
.iw-c{background:linear-gradient(135deg,#FFE4E4,#FFD9C4);color:var(--coral-text);}
.iw-t{background:linear-gradient(135deg,#CCFBF1,#BAE6FD);color:var(--teal-text);}
.iw-y{background:linear-gradient(135deg,#FEF3C7,#FED7AA);color:var(--yellow-text);}
.iw-p{background:linear-gradient(135deg,#EDE9FE,#FCE7F3);color:var(--purple-text);}

/* ── BROWSER MOCKUP ─────────────────────────── */
.bw{background:#fff;border-radius:16px;box-shadow:var(--shadow-lg);border:1px solid var(--border);overflow:hidden;}
.bw-bar{background:#F8F9FB;padding:10px 14px;display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--border);}
.bw-dots span{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:5px;}
.bw-dots span:nth-child(1){background:#FF5F57;}
.bw-dots span:nth-child(2){background:#FEBC2E;}
.bw-dots span:nth-child(3){background:#28C840;}
.bw-url{flex:1;background:#fff;border:1px solid var(--border);border-radius:8px;padding:4px 10px;font-size:11px;color:var(--muted);font-family:'DM Sans',sans-serif;display:flex;align-items:center;gap:6px;}
.bw-url::before{content:'';display:inline-block;width:9px;height:9px;opacity:.4;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%23000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='11' width='18' height='11' rx='2'/%3E%3Cpath d='M7 11V7a5 5 0 0110 0v4'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%23000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='11' width='18' height='11' rx='2'/%3E%3Cpath d='M7 11V7a5 5 0 0110 0v4'/%3E%3C/svg%3E") center/contain no-repeat;}
.bw-body{position:relative;overflow:hidden;}

/* ── E-COMMERCE MOCKUP ──────────────────────── */
.ec-header{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid var(--border2);}
.ec-logo{font-family:'Space Grotesk',sans-serif;font-size:18px;font-weight:700;letter-spacing:.05em;background:linear-gradient(135deg,var(--coral),var(--orange));-webkit-background-clip:text;background-clip:text;color:transparent;}
.ec-nav{display:flex;gap:16px;font-size:10px;color:var(--muted);font-weight:500;}
.ec-icons{display:flex;gap:10px;align-items:center;font-size:11px;}
.ec-cart{background:var(--coral);color:#fff;border-radius:50px;padding:3px 9px;font-size:10px;font-weight:700;}
.ec-hero{padding:24px 18px;background:linear-gradient(135deg,#FFE4E4 0%,#FED7AA 100%);position:relative;overflow:hidden;}
.ec-hero h3{font-size:18px;font-weight:700;color:var(--dark);line-height:1.1;margin-bottom:4px;}
.ec-hero span{font-family:'Dancing Script',cursive;font-size:22px;color:var(--coral-text);display:block;line-height:1;}
.ec-hero .ec-btn{display:inline-block;margin-top:10px;background:var(--dark);color:#fff;font-size:10px;font-weight:600;padding:6px 14px;border-radius:50px;}
.ec-hero::after{content:'';position:absolute;right:-30px;top:-30px;width:100px;height:100px;border-radius:50%;background:rgba(255,142,83,.4);}
.ec-products{padding:14px;display:grid;grid-template-columns:repeat(4,1fr);gap:8px;}
.ec-prod{background:#FAFAFA;border-radius:8px;overflow:hidden;transition:transform .3s;will-change:transform;}
.ec-prod:hover{transform:translateY(-3px);}
.ec-prod-img{height:48px;background:linear-gradient(135deg,#FFE4E4,#FED7AA);}
.ec-prod:nth-child(2) .ec-prod-img{background:linear-gradient(135deg,#CCFBF1,#BAE6FD);}
.ec-prod:nth-child(3) .ec-prod-img{background:linear-gradient(135deg,#FEF3C7,#FED7AA);}
.ec-prod:nth-child(4) .ec-prod-img{background:linear-gradient(135deg,#FCE7F3,#EDE9FE);}
.ec-prod-info{padding:6px 8px;}
.ec-prod-info b{display:block;font-size:9px;color:var(--dark);font-weight:600;}
.ec-prod-info span{font-size:9px;color:var(--coral-text);font-weight:700;}

/* ── RESTAURANT MOCKUP ──────────────────────── */
.rest-nav{display:flex;align-items:center;justify-content:space-between;padding:12px 18px;background:#fff;border-bottom:1px solid var(--border2);}
.rest-logo{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:14px;letter-spacing:.18em;color:var(--dark);}
.rest-links{display:flex;gap:14px;font-size:10px;color:var(--muted);font-weight:500;}
.rest-hero{height:148px;background:linear-gradient(135deg,#0F172A 0%,#1E293B 60%,#FF6B6B 130%);position:relative;display:flex;align-items:center;justify-content:center;padding:20px;overflow:hidden;}
.rest-hero::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 30% 40%,rgba(20,184,166,.4),transparent 60%);}
.rest-hero-content{text-align:center;color:#fff;position:relative;z-index:1;}
.rest-hero-content h3{color:#fff;font-size:20px;font-weight:700;margin-bottom:4px;}
.rest-hero-content p{font-size:10px;opacity:.85;margin-bottom:10px;letter-spacing:.05em;}
.rest-hero-btn{display:inline-block;background:var(--coral);color:#fff;font-size:10px;font-weight:600;padding:6px 14px;border-radius:50px;}
.rest-menu{padding:14px 18px;}
.rest-menu h4{font-size:11px;color:var(--coral-text);font-weight:700;text-transform:uppercase;letter-spacing:.1em;margin-bottom:8px;}
.rest-item{display:flex;justify-content:space-between;align-items:baseline;padding:6px 0;border-bottom:1px dashed var(--border);}
.rest-item:last-child{border-bottom:none;}
.rest-item-name{font-size:10px;font-weight:600;color:var(--dark);}
.rest-item-desc{font-size:9px;color:var(--muted);font-style:italic;margin-top:1px;}
.rest-item-price{font-size:10px;font-weight:700;color:var(--coral-text);}

/* ── PORTFOLIO MOCKUP ───────────────────────── */
.port-nav{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;background:#fff;}
.port-logo{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:13px;letter-spacing:.15em;color:var(--dark);}
.port-logo span{color:var(--coral-text);}
.port-links{display:flex;gap:12px;font-size:10px;color:var(--muted);}
.port-hero{padding:20px 18px;background:#FFF8F0;}
.port-hero h3{font-size:22px;font-weight:700;line-height:1.05;color:var(--dark);margin-bottom:6px;}
.port-hero h3 em{font-family:'Dancing Script',cursive;font-style:normal;font-weight:700;color:var(--coral-text);}
.port-hero p{font-size:10px;color:var(--muted);}
.port-gallery{padding:12px;display:grid;grid-template-columns:repeat(3,1fr);gap:6px;}
.port-img{height:54px;border-radius:6px;position:relative;overflow:hidden;}
.port-img:nth-child(1){background:linear-gradient(135deg,#FEE2E2,#FFEDD5);}
.port-img:nth-child(2){background:linear-gradient(135deg,#CFFAFE,#DBEAFE);}
.port-img:nth-child(3){background:linear-gradient(135deg,#FEF3C7,#FED7AA);}
.port-img:nth-child(4){background:linear-gradient(135deg,#FCE7F3,#FBCFE8);}
.port-img:nth-child(5){background:linear-gradient(135deg,#D1FAE5,#A7F3D0);}
.port-img:nth-child(6){background:linear-gradient(135deg,#E0E7FF,#C7D2FE);}
.port-img::after{content:'';position:absolute;inset:0;background:radial-gradient(circle at 50% 50%,rgba(255,255,255,.4),transparent 70%);}

/* ── BLOG MOCKUP ────────────────────────────── */
.blog-nav{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;background:#fff;border-bottom:1px solid var(--border2);}
.blog-logo{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:13px;color:var(--dark);}
.blog-logo b{color:var(--teal-text);}
.blog-links{display:flex;gap:14px;font-size:10px;color:var(--muted);}
.blog-feat{padding:14px 18px;background:linear-gradient(135deg,#CCFBF1,#BAE6FD);}
.blog-feat-tag{display:inline-block;background:var(--teal);color:#fff;font-size:9px;font-weight:700;padding:2px 8px;border-radius:50px;margin-bottom:8px;letter-spacing:.05em;text-transform:uppercase;}
.blog-feat h3{font-size:15px;line-height:1.2;font-weight:700;color:var(--dark);margin-bottom:5px;}
.blog-feat p{font-size:10px;color:var(--muted);line-height:1.5;}
.blog-grid{padding:12px;display:grid;grid-template-columns:repeat(3,1fr);gap:8px;}
.blog-card{background:#F8F9FB;border-radius:8px;overflow:hidden;}
.blog-card-img{height:36px;background:linear-gradient(135deg,#FFE4E4,#FED7AA);}
.blog-card:nth-child(2) .blog-card-img{background:linear-gradient(135deg,#FEF3C7,#FBCFE8);}
.blog-card:nth-child(3) .blog-card-img{background:linear-gradient(135deg,#D1FAE5,#CCFBF1);}
.blog-card-body{padding:6px 8px;}
.blog-card-body b{display:block;font-size:9px;color:var(--dark);font-weight:600;line-height:1.2;margin-bottom:3px;}
.blog-card-body span{font-size:8px;color:var(--muted);}

/* ── MINI SERVICE PREVIEW ───────────────────── */
.mini-prev{height:120px;border-radius:14px;overflow:hidden;position:relative;margin-bottom:20px;border:1px solid var(--border);}
.mini-prev::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 60%,rgba(255,255,255,.15) 100%);}
.mp-vitrine{background:linear-gradient(135deg,#FFE4E4,#CCFBF1);position:relative;}
.mp-vitrine::before{content:'';position:absolute;top:14px;left:14px;right:14px;height:6px;background:#fff;border-radius:3px;opacity:.7;}
.mp-vitrine span{position:absolute;top:34px;left:14px;font-size:14px;font-weight:700;color:var(--dark);}
.mp-vitrine em{position:absolute;top:60px;left:14px;width:100px;height:4px;background:rgba(15,23,42,.15);border-radius:2px;font-style:normal;}
.mp-vitrine i{position:absolute;top:80px;left:14px;width:60px;height:14px;background:var(--coral);border-radius:3px;}
.mp-ecom{background:linear-gradient(135deg,#FED7AA,#FCE7F3);}
.mp-ecom .grid{position:absolute;inset:14px;display:grid;grid-template-columns:repeat(3,1fr);gap:6px;}
.mp-ecom .grid div{background:rgba(255,255,255,.7);border-radius:6px;}
.mp-refonte{background:linear-gradient(135deg,#E2E8F0,#CBD5E1);position:relative;}
.mp-refonte::before{content:'AVANT';position:absolute;left:14px;top:50px;font-size:9px;font-weight:700;color:var(--muted);letter-spacing:.1em;}
.mp-refonte::after{content:'APRÈS';position:absolute;right:14px;top:50px;font-size:9px;font-weight:700;color:var(--coral-text);letter-spacing:.1em;}
.mp-refonte i{position:absolute;left:50%;top:46%;transform:translate(-50%,-50%);font-size:24px;color:var(--coral);font-style:normal;}
.mp-seo{background:linear-gradient(135deg,#CCFBF1,#FEF3C7);position:relative;padding:14px;}
.mp-seo b{display:block;font-size:10px;color:var(--muted);margin-bottom:6px;}
.mp-seo .res{background:#fff;border-radius:6px;padding:7px;box-shadow:0 2px 8px rgba(0,0,0,.04);}
.mp-seo .res-1{border-left:3px solid var(--teal);margin-bottom:4px;}
.mp-seo .res strong{display:block;font-size:9px;color:var(--teal-text);font-weight:600;}
.mp-seo .res em{display:block;font-size:8px;color:var(--muted);font-style:normal;margin-top:1px;}
.mp-main{background:linear-gradient(135deg,#EDE9FE,#FCE7F3);padding:14px;}
.mp-main .bar{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;}
.mp-main .bar b{font-size:10px;color:var(--dark);font-weight:600;}
.mp-main .bar span{background:#10B981;color:#fff;font-size:8px;padding:2px 6px;border-radius:50px;font-weight:700;}
.mp-main .stats{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;}
.mp-main .stat{background:rgba(255,255,255,.7);border-radius:6px;padding:6px;text-align:center;}
.mp-main .stat b{display:block;font-size:11px;color:var(--purple-text);font-weight:700;}
.mp-main .stat span{font-size:7px;color:var(--muted);}
.mp-iden{background:linear-gradient(135deg,#FFE4E4,#FEF3C7);padding:14px;display:flex;align-items:center;justify-content:center;gap:10px;}
.mp-iden .lg{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,var(--coral),var(--orange));display:flex;align-items:center;justify-content:center;color:#fff;font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:14px;}
.mp-iden .lg-s{width:24px;height:24px;}
.mp-iden .lg.sq{border-radius:8px;background:var(--dark);}
.mp-iden .lg.sq2{border-radius:8px;background:var(--teal);}

/* ── PRICING ────────────────────────────────── */
@property --a{syntax:'<angle>';initial-value:0deg;inherits:false;}
.pcard{background:#fff;border:1px solid var(--border);border-radius:28px;transition:transform .35s,box-shadow .35s;will-change:transform;}
.pcard:hover{transform:translateY(-8px);box-shadow:var(--shadow-md);}
.pcard-feat{position:relative;background:#fff;border-radius:28px;}
.pcard-feat::before{content:'';position:absolute;inset:-2px;border-radius:30px;z-index:-1;background:conic-gradient(from var(--a),var(--coral),var(--orange),var(--yellow),var(--teal),var(--coral));animation:spin 5s linear infinite;}
@keyframes spin{to{--a:360deg;}}

/* ── CHECKMARK ──────────────────────────────── */
.ck{width:20px;height:20px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;}
.ck-c{background:linear-gradient(135deg,#FFE4E4,#FED7AA);}
.ck-c::after{content:'';width:8px;height:8px;border-radius:50%;background:var(--coral);}
.ck-o{background:linear-gradient(135deg,var(--coral),var(--orange));}
.ck-o::after{content:'✓';color:#fff;font-size:12px;font-weight:700;}
.ck-t{background:linear-gradient(135deg,#CCFBF1,#BAE6FD);}
.ck-t::after{content:'';width:8px;height:8px;border-radius:50%;background:var(--teal);}

/* ── FAQ ────────────────────────────────────── */
.fa-body{max-height:0;overflow:hidden;transition:max-height .45s ease;}
.fa-body.o{max-height:260px;}
.fa-arr{transition:transform .35s;will-change:transform;}
.fa-arr.o{transform:rotate(180deg);}
.faq-i{background:#fff;border:1px solid var(--border);border-radius:16px;overflow:hidden;transition:border-color .3s,box-shadow .3s;}
.faq-i.o{border-color:var(--coral);box-shadow:var(--shadow-sm);}
.fb{width:100%;padding:20px 24px;text-align:left;display:flex;align-items:center;justify-content:space-between;gap:16px;background:transparent;border:none;cursor:pointer;}
.fb-text{font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:15px;color:var(--dark);}

/* ── REVEAL ─────────────────────────────────── */
.rv{opacity:0;transform:translate3d(0,40px,0);transition:opacity .75s ease,transform .75s ease;will-change:transform,opacity;}
.rv.on{opacity:1;transform:translate3d(0,0,0);}
.rv-l{opacity:0;transform:translate3d(-50px,0,0);transition:opacity .75s ease,transform .75s ease;will-change:transform,opacity;}
.rv-l.on{opacity:1;transform:translate3d(0,0,0);}
.rv-r{opacity:0;transform:translate3d(50px,0,0);transition:opacity .75s ease,transform .75s ease;will-change:transform,opacity;}
.rv-r.on{opacity:1;transform:translate3d(0,0,0);}
.rv-z{opacity:0;transform:scale(.85);transition:opacity .65s ease,transform .65s var(--ease);will-change:transform,opacity;}
.rv-z.on{opacity:1;transform:scale(1);}

/* ── SPLIT TEXT ─────────────────────────────── */
.split-w{display:inline-block;overflow:hidden;}
.split-l{display:inline-block;transform:translate3d(0,110%,0);opacity:0;transition:transform .8s var(--ease),opacity .8s ease;will-change:transform,opacity;}
.split-on .split-l{transform:translate3d(0,0,0);opacity:1;}

/* ── TYPEWRITER ─────────────────────────────── */
#tw::after{content:'|';color:var(--coral);animation:bl .75s step-end infinite;will-change:opacity;}
@keyframes bl{50%{opacity:0;}}

/* ── MARQUEE ────────────────────────────────── */
.mq-wrap{overflow:hidden;border-top:1px solid var(--border);border-bottom:1px solid var(--border);background:var(--bg2);position:relative;z-index:2;}
.mq-track{display:flex;gap:0;white-space:nowrap;animation:mq 28s linear infinite;will-change:transform;}
.mq-track:hover{animation-play-state:paused;}
@keyframes mq{0%{transform:translate3d(0,0,0);}100%{transform:translate3d(-50%,0,0);}}
.mq-item{padding:18px 36px;font-family:'Space Grotesk',sans-serif;font-size:13px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);display:flex;align-items:center;gap:24px;flex-shrink:0;}
.mq-item:nth-child(odd){color:var(--coral-text);}
.mq-dot{width:6px;height:6px;border-radius:50%;background:var(--orange);flex-shrink:0;}

/* ── STAT DIVIDER ───────────────────────────── */
.st-col:not(:last-child){border-right:1px solid var(--border);}

/* ── PROCESS ────────────────────────────────── */
@media(min-width:768px){
  .pc-step{position:relative;}
  .pc-step:not(:last-child)::after{content:'';position:absolute;top:42px;left:62%;width:76%;height:2px;background:repeating-linear-gradient(to right,var(--coral) 0,var(--coral) 6px,transparent 6px,transparent 12px);}
}

/* ── SECTION Z ──────────────────────────────── */
section{position:relative;z-index:2;}

/* ── SHOWCASE ───────────────────────────────── */
.show-card{position:relative;border-radius:24px;padding:6px;background:#fff;border:1px solid var(--border);transition:transform .4s,box-shadow .4s;overflow:hidden;will-change:transform;}
.show-card:hover{transform:translateY(-8px);box-shadow:var(--shadow-lg);}
.show-card-label{display:flex;justify-content:space-between;align-items:center;padding:14px 18px 8px;}
.show-card-label h4{font-size:16px;font-weight:700;}
.show-card-tag{font-size:10px;padding:4px 10px;border-radius:50px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;}
.tag-c{background:linear-gradient(135deg,#FFE4E4,#FED7AA);color:var(--coral-text);}
.tag-t{background:linear-gradient(135deg,#CCFBF1,#BAE6FD);color:var(--teal-text);}
.tag-y{background:linear-gradient(135deg,#FEF3C7,#FED7AA);color:#92400E;}
.tag-p{background:linear-gradient(135deg,#EDE9FE,#FCE7F3);color:var(--purple-text);}

/* ── FORM ───────────────────────────────────── */
.fi{background:#fff;border:1.5px solid var(--border);color:var(--dark);border-radius:14px;padding:13px 16px;font-size:14px;font-family:'DM Sans',sans-serif;outline:none;transition:border-color .3s,box-shadow .3s;-webkit-appearance:none;appearance:none;width:100%;}
.fi::placeholder{color:var(--muted2);}
.fi:focus{border-color:var(--coral);box-shadow:0 0 0 4px rgba(255,107,107,.12);}
.fi:focus-visible{outline:2px solid var(--coral);outline-offset:2px;}
.fi option{background:#fff;color:var(--dark);}

/* ── FLOATING SHAPES ────────────────────────── */
.fs{position:absolute;pointer-events:none;will-change:transform;}
.fs-1{top:18%;right:6%;width:80px;height:80px;border-radius:24px;background:linear-gradient(135deg,var(--coral),var(--orange));opacity:.18;animation:float1 8s ease-in-out infinite;}
.fs-2{bottom:14%;left:4%;width:60px;height:60px;border-radius:50%;background:linear-gradient(135deg,var(--teal),var(--teal2));opacity:.2;animation:float2 7s ease-in-out infinite;}
.fs-3{top:60%;right:20%;width:30px;height:30px;border-radius:8px;background:var(--yellow);opacity:.3;animation:float3 6s ease-in-out infinite;}
.fs-4{top:35%;left:8%;width:24px;height:24px;border-radius:50%;background:var(--purple);opacity:.3;animation:float2 9s ease-in-out infinite;}
.fs-5{top:8%;left:50%;width:14px;height:14px;border-radius:50%;background:var(--coral);opacity:.5;animation:float3 5s ease-in-out infinite;}
@keyframes float1{0%,100%{transform:translate3d(0,0,0) rotate(-12deg);}50%{transform:translate3d(8px,-12px,0) rotate(-8deg);}}
@keyframes float2{0%,100%{transform:translate3d(0,0,0);}50%{transform:translate3d(-10px,10px,0);}}
@keyframes float3{0%,100%{transform:translate3d(0,0,0) rotate(20deg);}50%{transform:translate3d(10px,-8px,0) rotate(28deg);}}

/* ── SEP ────────────────────────────────────── */
.sep{height:1px;background:linear-gradient(90deg,transparent,var(--border),transparent);}

/* ── PAGE HERO ──────────────────────────────── */
.page-hero{padding:140px 0 80px;position:relative;overflow:hidden;}
.page-hero h1{font-family:'Space Grotesk',sans-serif;font-weight:700;line-height:1.02;letter-spacing:-.02em;font-size:54px;}
@media(min-width:768px){.page-hero h1{font-size:84px;}}

/* ── TESTIMONIALS ───────────────────────────── */
.testi{background:#fff;border:1px solid var(--border);border-radius:24px;padding:32px;position:relative;transition:transform .35s,box-shadow .35s,border-color .35s;will-change:transform;}
.testi:hover{transform:translateY(-6px);box-shadow:var(--shadow-md);border-color:rgba(255,107,107,.3);}
.testi::before{content:'"';font-family:'Space Grotesk',sans-serif;position:absolute;top:0;right:20px;font-size:120px;color:rgba(255,107,107,.1);line-height:1;font-weight:700;}
.testi p{font-size:15px;line-height:1.6;color:var(--dark2);margin-bottom:20px;position:relative;}
.testi-author{display:flex;align-items:center;gap:14px;}
.testi-avatar{width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:18px;flex-shrink:0;}
.testi-author-info b{display:block;font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:14px;color:var(--dark);}
.testi-author-info span{font-size:12px;color:var(--muted);}

/* ── CTA BANNER ─────────────────────────────── */
.cta-banner{position:relative;border-radius:32px;padding:60px 40px;overflow:hidden;background:linear-gradient(135deg,var(--coral),var(--orange));color:#fff;}
.cta-banner::before,.cta-banner::after{content:'';position:absolute;border-radius:50%;will-change:transform;}
.cta-banner::before{width:280px;height:280px;background:rgba(252,211,77,.25);top:-100px;right:-50px;animation:bf2 18s ease-in-out infinite;}
.cta-banner::after{width:200px;height:200px;background:rgba(255,255,255,.12);bottom:-80px;left:-40px;animation:bf3 22s ease-in-out infinite;}
.cta-banner h2{color:#fff;font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:38px;line-height:1.05;margin-bottom:16px;position:relative;z-index:1;}
@media(min-width:768px){.cta-banner h2{font-size:54px;}}
.cta-banner p{font-size:18px;opacity:.95;margin-bottom:28px;max-width:520px;position:relative;z-index:1;}
.cta-banner-actions{position:relative;z-index:1;display:flex;flex-wrap:wrap;gap:14px;}

/* ── FAB ────────────────────────────────────── */
.fab{position:fixed;right:24px;bottom:24px;z-index:40;width:60px;height:60px;border-radius:50%;background:linear-gradient(135deg,var(--coral),var(--orange));display:flex;align-items:center;justify-content:center;box-shadow:0 12px 30px rgba(255,107,107,.4);text-decoration:none;color:#fff;transition:transform .3s,box-shadow .3s;animation:fabPulse 2.5s ease-in-out infinite;will-change:transform,box-shadow;}
.fab:hover{transform:scale(1.1);box-shadow:0 18px 40px rgba(255,107,107,.5);}
.fab:focus-visible{outline:3px solid var(--coral);outline-offset:3px;}
@keyframes fabPulse{0%,100%{box-shadow:0 12px 30px rgba(255,107,107,.4),0 0 0 0 rgba(255,107,107,.3);}50%{box-shadow:0 12px 30px rgba(255,107,107,.4),0 0 0 16px rgba(255,107,107,0);}}

/* ── FILTER TABS ────────────────────────────── */
.filter-tabs{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-bottom:40px;}
.f-tab{padding:10px 22px;border-radius:50px;border:1.5px solid var(--border);background:#fff;color:var(--muted);font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:14px;transition:all .3s;cursor:pointer;}
.f-tab:hover{border-color:var(--coral);color:var(--coral-text);}
.f-tab.active{background:linear-gradient(135deg,var(--coral),var(--orange));border-color:transparent;color:#fff;box-shadow:var(--shadow-coral);}
.f-tab:focus-visible{outline:3px solid var(--coral);outline-offset:2px;}

/* ── CONFETTI ───────────────────────────────── */
.confetti{position:fixed;pointer-events:none;z-index:9999;will-change:transform,opacity;}

/* ── COMPARISON TABLE ───────────────────────── */
.compare{width:100%;border-collapse:separate;border-spacing:0;background:#fff;border-radius:20px;overflow:hidden;box-shadow:var(--shadow-sm);}
.compare th,.compare td{padding:18px 20px;text-align:left;font-size:14px;border-bottom:1px solid var(--border2);color:var(--dark2);}
.compare th{background:var(--bg2);font-family:'Space Grotesk',sans-serif;font-weight:700;color:var(--dark);font-size:13px;text-transform:uppercase;letter-spacing:.05em;}
.compare th.fc{color:var(--coral-text);}
.compare td.center{text-align:center;}
.compare tr:hover td{background:var(--bg2);}
.compare td.mid{background:rgba(255,107,107,.04);}

/* ── COUNTERS ───────────────────────────────── */
.counter-group{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:20px;}
.counter-item{text-align:center;padding:20px;border-radius:20px;background:#fff;border:1px solid var(--border);transition:transform .3s,box-shadow .3s;}
.counter-item:hover{transform:translateY(-4px);box-shadow:var(--shadow-md);}
.counter-num{font-family:'Space Grotesk',sans-serif;font-size:48px;font-weight:700;line-height:1;}

/* ── SKIP LINK (accessibility) ──────────────── */
.skip-link{position:absolute;top:-80px;left:0;background:var(--dark);color:#fff;padding:12px 20px;border-radius:0 0 12px 0;text-decoration:none;font-weight:600;z-index:99999;transition:top .2s;}
.skip-link:focus{top:0;}

/* ── FOCUS VISIBLE — accessibility ──────────── */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--coral);outline-offset:2px;border-radius:4px;}

/* ════════════════════════════════════════════════
   ENHANCED ANIMATIONS — transform/opacity only
═════════════════════════════════════════════════ */

/* ── BUTTON SHINE SWEEP ────────────────────────── */
.btn-c::before{
  content:'';position:absolute;top:0;left:0;
  width:50%;height:100%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.25),transparent);
  transform:translateX(-200%);
  transition:transform .45s ease;
  z-index:2;pointer-events:none;
}
.btn-c:hover::before{transform:translateX(340%);}

/* ── BUTTON DARK — subtle scale on hover ───────── */
.btn-d{will-change:transform;}
.btn-d:hover{transform:translateY(-2px) scale(1.02);}

/* ── BUTTON WHITE — subtle scale on hover ──────── */
.btn-w{will-change:transform;}
.btn-w:hover{transform:translateY(-2px) scale(1.02);}

/* ── CARD — enhanced hover with micro-scale ────── */
.card:hover{transform:translateY(-6px) scale(1.01);}

/* ── SERVICE CARD — preview zoom on hover ──────── */
.svc .mini-prev{transition:transform .4s var(--ease);}
.svc:hover .mini-prev{transform:scale(1.04);}

/* ── TESTIMONIAL — quote mark float on hover ───── */
.testi::before{transition:transform .4s var(--ease);}
.testi:hover::before{transform:scale(1.12) translateY(-4px);}

/* ── SHOWCASE — inner mockup zoom on hover ─────── */
.show-card .bw{transition:transform .4s var(--ease);}
.show-card:hover .bw{transform:scale(1.015);}

/* ── PRICING CARD — enhanced hover scale ───────── */
.pcard:hover{transform:translateY(-8px) scale(1.01);}

/* ── COUNTER ITEM — enhanced hover ─────────────── */
.counter-item:hover{transform:translateY(-4px) scale(1.02);}

/* ── FOOTER LINKS — animated underline ─────────── */
footer nav a{position:relative;display:inline-block;}
footer nav a::after{
  content:'';position:absolute;bottom:-2px;left:0;
  width:100%;height:1.5px;
  background:linear-gradient(90deg,var(--coral),var(--orange));
  border-radius:1px;
  transform:scaleX(0);transform-origin:left;
  transition:transform .3s var(--ease);
}
footer nav a:hover::after{transform:scaleX(1);}

/* ── NAV LOGO — subtle hover bounce ────────────── */
.nav-logo svg{transition:transform .3s var(--ease);}
.nav-logo:hover svg{transform:rotate(-8deg) scale(1.08);}

/* ── FAB — enhanced hover scale ────────────────── */
.fab:hover{transform:scale(1.12);}

/* ── FILTER TAB — hover lift ───────────────────── */
.f-tab{will-change:transform;transition:all .3s var(--ease);}
.f-tab:hover{transform:translateY(-2px);}
.f-tab.active{transform:translateY(-1px);}

/* ── FAQ ITEM — smooth expand icon rotation ────── */
.fa-arr{transition:transform .35s var(--ease);}

/* ── SECTION REVEAL — smooth stagger entrance ──── */
.rv-stagger{opacity:0;transform:translate3d(0,30px,0);transition:opacity .5s ease,transform .5s ease;will-change:transform,opacity;}
.rv-stagger.on{opacity:1;transform:translate3d(0,0,0);}

/* ── BADGE ENTRANCE — subtle scale bounce ──────── */
.rv .badge,.rv-l .badge,.rv-r .badge{
  transform:scale(.92);opacity:0;
  transition:transform .4s var(--ease),opacity .35s ease;
}
.rv.on .badge,.rv-l.on .badge,.rv-r.on .badge{
  transform:scale(1);opacity:1;
}

/* ── SEPARATOR — grow in from center ───────────── */
.sep{transform:scaleX(0);transition:transform .6s var(--ease);}
.sep.on{transform:scaleX(1);}

/* ── HAMBURGER LINES — hover spread ────────────── */
.ham:hover span:nth-child(1){transform:translateY(-1px);}
.ham:hover span:nth-child(3){transform:translateY(1px);}
.ham span{transition:transform .25s ease;}

/* ── MOBILE MENU LINKS — stagger entrance ──────── */
#mm.o li{opacity:0;transform:translate3d(20px,0,0);animation:mmSlide .35s var(--ease) forwards;}
#mm.o li:nth-child(1){animation-delay:.05s;}
#mm.o li:nth-child(2){animation-delay:.1s;}
#mm.o li:nth-child(3){animation-delay:.15s;}
#mm.o li:nth-child(4){animation-delay:.2s;}
#mm.o li:nth-child(5){animation-delay:.25s;}
@keyframes mmSlide{to{opacity:1;transform:translate3d(0,0,0);}}

/* ── E-COMMERCE PRODUCT HOVER — subtle lift ────── */
.ec-prod{transition:transform .3s var(--ease);}
.ec-prod:hover{transform:translateY(-3px) scale(1.03);}

/* ── Reserve space for fonts (prevent CLS) ──── */
h1{font-size-adjust:0.5;}

/* ═══════════════════════════════════════════════
   NYLOR NC — Nouvelle-Calédonie identity & enhancements
═══════════════════════════════════════════════ */

/* ── NC INLINE ICON ────────────────────────── */
.nc-icon{display:inline-block;width:1em;height:1em;vertical-align:-.125em;flex-shrink:0;}

/* ── ENHANCED SERVICE CARD HOVER — SPOTLIGHT ── */
.svc-inner{position:relative;z-index:1;}
.svc-inner::after{
  content:'';position:absolute;inset:0;border-radius:23px;
  background:radial-gradient(circle at var(--mouse-x,50%) var(--mouse-y,50%),rgba(255,107,107,.07),transparent 45%);
  opacity:0;transition:opacity .4s cubic-bezier(.22,1,.36,1);pointer-events:none;
}
.svc:hover .svc-inner::after{opacity:1;}
.svc{transition:box-shadow .4s cubic-bezier(.22,1,.36,1),border-color .4s cubic-bezier(.22,1,.36,1),transform .4s cubic-bezier(.22,1,.36,1);}
.svc:hover{transform:translateY(-4px);box-shadow:0 20px 40px rgba(15,23,42,.1);}

/* Service title arrow */
.svc-arrow{
  display:inline-flex;opacity:0;
  transform:translateX(-6px);
  transition:opacity .4s cubic-bezier(.22,1,.36,1),transform .4s cubic-bezier(.22,1,.36,1);
  color:var(--coral);
}
.svc:hover .svc-arrow{opacity:1;transform:translateX(0);}
.svc:hover h3{color:var(--dark);}
.svc-inner>p:not(:last-child){transition:opacity .4s cubic-bezier(.22,1,.36,1);opacity:.85;}
.svc:hover .svc-inner>p:not(:last-child){opacity:1;}

/* ── ENHANCED LOADER — DARK THEME ─────────── */
#loader{background:#0F172A !important;}
.loader-bar{
  position:absolute;bottom:0;left:0;height:2px;width:0;
  background:linear-gradient(90deg,var(--coral),var(--orange),var(--yellow));
  animation:loaderBarGrow 1.2s cubic-bezier(.22,1,.36,1) forwards;
  will-change:transform;
}
@keyframes loaderBarGrow{from{width:0}to{width:100%}}
.loader-svg rect,.loader-svg path{stroke:url(#lgl);}
.loader-text span{
  color:#fff;display:inline-block;will-change:transform,opacity;
  opacity:0;transform:translateY(16px);
  animation:loaderLetReveal .5s cubic-bezier(.22,1,.36,1) forwards;
}
.loader-text span:nth-child(1){animation-delay:.15s}
.loader-text span:nth-child(2){animation-delay:.22s}
.loader-text span:nth-child(3){animation-delay:.29s}
.loader-text span:nth-child(4){animation-delay:.36s}
.loader-text span:nth-child(5){animation-delay:.43s}
@keyframes loaderLetReveal{to{opacity:1;transform:translateY(0)}}
#loader.gone{opacity:0;transform:translateY(-24px);transition:opacity .45s ease,transform .45s ease;pointer-events:none;}

/* ── SCROLL PROGRESS — NC ACCENT ──────────── */
#prog{background:linear-gradient(90deg,var(--coral),var(--orange),#00A6D6);}

@media(prefers-reduced-motion:reduce){
  .svc-inner::after{display:none}
  .svc-arrow{display:none}
  .loader-bar{animation:none;width:100%}
  .loader-text span{opacity:1;transform:none;animation:none}
}
