/* NIPHT redesign — shared styles */
:root{--ink:#12321F;--ink2:#3D5446;--mute:#5E7366;--bg:#FBF8F1;--card:#fff;--line:#E7E1D2;--sand:#F4F0E6;--leaf:#1F6B2E;--leafbg:#E6F0E3;--orange:#E8641B;--orange2:#F08A3E;--peach:#FCE9DC;--forest:#12321F;--night:#0D2617}
body{margin:0;background:var(--bg)}
*{box-sizing:border-box}
.page{font-family:Mukta,system-ui,sans-serif;color:var(--ink);background:var(--bg);min-height:100vh;position:relative}
.wrap{max-width:1240px;margin:0 auto;padding-left:24px;padding-right:24px}
.sec{padding-top:96px;padding-bottom:96px}
.kicker{margin:0;color:var(--orange);font-weight:700;letter-spacing:1px;font-size:14px;text-transform:uppercase}
.h1{margin:10px 0 0;font-size:56px;line-height:1.1;font-weight:800;letter-spacing:-.3px}
.h2{margin:8px 0 0;font-size:42px;line-height:1.18;font-weight:800}
.h3{margin:0;font-size:22px;line-height:1.3;font-weight:800}
.lead{font-size:19px;line-height:1.65;color:var(--ink2)}
.muted{color:var(--mute)}
.serif{font-family:Fraunces,Georgia,serif}
.card{background:var(--card);border:1px solid var(--line);border-radius:22px}
.chip{display:inline-flex;align-items:center;gap:6px;background:var(--leafbg);color:var(--leaf);font-weight:700;padding:6px 14px;border-radius:999px;font-size:14px}
.chip-o{background:var(--peach);color:#B4480F}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:inherit;font-weight:700;font-size:17px;padding:14px 26px;border-radius:999px;text-decoration:none;border:0;cursor:pointer;transition:transform .2s,background .2s,box-shadow .2s}
.btn:hover{transform:translateY(-2px)}
.btn-o{background:var(--orange);color:#fff}.btn-o:hover{background:#D3540F;color:#fff;box-shadow:0 14px 30px -12px rgba(232,100,27,.7)}
.btn-g{background:var(--forest);color:#fff}.btn-g:hover{color:#fff}
.btn-w{background:#fff;color:var(--ink)}.btn-w:hover{color:var(--ink)}
.btn-line{background:transparent;color:var(--ink);border:1.5px solid #CFC7B4}.btn-line:hover{color:var(--orange);border-color:var(--orange)}
.btn-ghost{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.45)}.btn-ghost:hover{color:#fff;background:rgba(255,255,255,.08)}
.btn-wa{background:#1FA855;color:#fff}.btn-wa:hover{color:#fff}
.lift{transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s}
.lift:hover{transform:translateY(-6px);box-shadow:0 26px 50px -20px rgba(18,50,31,.35)}
.grid{display:grid;gap:24px}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}.g3{grid-template-columns:repeat(3,minmax(0,1fr))}.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
.auto{grid-template-columns:repeat(auto-fill,minmax(270px,1fr))}
.row{display:flex;gap:24px;flex-wrap:wrap}
.field{font-family:inherit;font-size:16px;padding:12px 14px;border:1.5px solid #D9D2C1;border-radius:12px;background:#fff;color:var(--ink);width:100%}
.field:focus{outline:none;border-color:var(--orange);box-shadow:0 0 0 4px rgba(232,100,27,.15)}
.lbl{font-size:14px;font-weight:600;display:flex;flex-direction:column;gap:6px}
.ph{background:repeating-linear-gradient(45deg,#E9E2D1 0 12px,#E2DAC6 12px 24px);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#6B6452;font-weight:600;font-size:13px;padding:12px;gap:4px}
.ph b{font-size:14px;color:#4A4434}
.hero-dark{background:radial-gradient(1100px 560px at 85% 10%,#1E5A31 0%,#12321F 60%);color:#fff}
.navlink{color:var(--ink);text-decoration:none;font-weight:600;font-size:16px;position:relative}
.navlink:hover{color:var(--orange)}
.navlink.on{color:var(--orange)}
.navlink.on:after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;background:var(--orange);border-radius:2px}
.flink{color:#B9CDB5;text-decoration:none}.flink:hover{color:#fff}
.tbl{width:100%;border-collapse:collapse;font-size:15px}
.tbl th{text-align:left;font-size:13px;color:var(--mute);font-weight:700;padding:12px 14px;border-bottom:1px solid var(--line);background:var(--sand)}
.tbl td{padding:14px;border-bottom:1px solid var(--line)}
.tbl tr:hover td{background:#FDFBF6}
.tabbtn{font-family:inherit;font-size:16px;font-weight:700;padding:10px 20px;border-radius:999px;cursor:pointer;transition:all .2s}
/* motion */
@keyframes rise{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
@keyframes fade{from{opacity:0}to{opacity:1}}
@keyframes kb{0%{transform:scale(1.08) translate(0,0)}100%{transform:scale(1.22) translate(-3%,-2%)}}
@keyframes xfade{0%,28%{opacity:1}34%,94%{opacity:0}100%{opacity:1}}
@keyframes floaty{0%,100%{transform:translateY(0) rotate(var(--r,0deg))}50%{transform:translateY(-14px) rotate(var(--r,0deg))}}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(232,100,27,.55)}100%{box-shadow:0 0 0 16px rgba(232,100,27,0)}}
@keyframes pulsewa{0%{box-shadow:0 0 0 0 rgba(31,168,85,.55)}100%{box-shadow:0 0 0 18px rgba(31,168,85,0)}}
@keyframes pop{0%{transform:scale(.5);opacity:0}70%{transform:scale(1.1)}100%{transform:scale(1);opacity:1}}
@keyframes grow{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@keyframes shimmer{from{background-position:-200% 0}to{background-position:200% 0}}
@keyframes confetti{0%{transform:translateY(-20px) rotate(0);opacity:0}10%{opacity:1}100%{transform:translateY(420px) rotate(540deg);opacity:0}}
@keyframes slideup{from{transform:translateY(120%)}to{transform:none}}
.rise{animation:rise .8s cubic-bezier(.2,.7,.2,1) both}
.d1{animation-delay:.1s}.d2{animation-delay:.22s}.d3{animation-delay:.34s}.d4{animation-delay:.46s}.d5{animation-delay:.58s}
.float{animation:floaty 6s ease-in-out infinite}
.track{animation:marquee 40s linear infinite}
.track:hover{animation-play-state:paused}
.dot{animation:pulse 1.6s ease-out infinite}
.pop{animation:pop .55s cubic-bezier(.2,.7,.2,1) both}
.kb{animation:kb 14s ease-in-out infinite alternate}
.line-grow{transform-origin:top;animation:grow 1.4s cubic-bezier(.2,.7,.2,1) both}
.shine{background:linear-gradient(90deg,#fff 0%,#FFE1CC 50%,#fff 100%);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shimmer 4s linear infinite}
@media (prefers-reduced-motion:reduce){*{animation:none !important;transition:none !important}}
@media (max-width:860px){.h1{font-size:40px}.h2{font-size:32px}.g2,.g3,.g4{grid-template-columns:1fr}.hide-sm{display:none !important}.stack-sm{flex-direction:column !important}.sec{padding-top:64px;padding-bottom:64px}}