:root{
  --bg:#060504;
  --bg2:#0b0a08;
  --silver:#c9d3d9;
  --silver-hi:#f2f6f8;
  --silver-dim:#7d8891;
  --line:rgba(201,211,217,0.16);
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{background:var(--bg);color:#eae6dc;font-family:'Inter',sans-serif;overflow-x:hidden;}
a{color:inherit;text-decoration:none;}
::selection{background:var(--silver);color:#050506;}
.container{max-width:1180px;margin:0 auto;padding:0 32px;}
.chrome{
  background:linear-gradient(180deg,#f2f6f8 0%, #a8b4bc 30%, #7d8891 50%, #a8b4bc 70%, #f2f6f8 100%);
  background-size:100% 300%;-webkit-background-clip:text;background-clip:text;color:transparent;
  animation:chromeShift 6s ease-in-out infinite;
}
@keyframes chromeShift{0%,100%{background-position:0 0%;}50%{background-position:0 100%;}}

header{position:fixed;top:0;left:0;right:0;z-index:500;display:flex;justify-content:space-between;align-items:center;padding:22px 48px;background:linear-gradient(to bottom, rgba(6,5,4,0.95), transparent);}
.logo{font-family:'Bebas Neue';font-size:24px;letter-spacing:3px;color:#f4f1e9;}
.logo span{color:var(--silver-dim);}
.logo-link{display:flex;align-items:center;gap:10px;}
.back-link{font-size:11px;letter-spacing:1px;text-transform:uppercase;color:var(--silver-dim);}
.cta-small{background:linear-gradient(120deg,var(--silver-hi),var(--silver) 60%,var(--silver-hi));color:#050506;padding:12px 26px;font-size:12px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;transition:transform .3s,box-shadow .3s;border-radius:1px;}
.cta-small:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(201,211,217,0.28);}

.btn-primary{background:linear-gradient(120deg,var(--silver-hi),var(--silver) 55%,var(--silver-hi));color:#050506;padding:17px 32px;font-size:12px;font-weight:700;letter-spacing:2px;text-transform:uppercase;transition:transform .3s,box-shadow .3s;text-align:center;display:inline-block;border-radius:1px;border:none;cursor:pointer;}
.btn-primary:hover{transform:translateY(-3px);box-shadow:0 12px 30px rgba(201,211,217,0.25);}
.btn-primary:disabled{opacity:.4;cursor:not-allowed;filter:grayscale(.4);}
.btn-outline{border:1px solid var(--silver-dim);padding:16px 32px;font-size:12px;font-weight:700;letter-spacing:2px;text-transform:uppercase;transition:.3s;display:inline-block;}
.btn-outline:hover{border-color:var(--silver-hi);background:rgba(242,246,248,0.06);}

/* HERO */
.hero{min-height:92vh;position:relative;display:flex;align-items:center;padding:150px 48px 60px;}
.hero-grid{display:grid;grid-template-columns:1.05fr 0.95fr;gap:50px;align-items:center;max-width:1280px;margin:0 auto;width:100%;}
.eyebrow-tag{font-size:12px;font-weight:600;letter-spacing:3px;text-transform:uppercase;color:var(--silver-hi);margin-bottom:24px;}
.hero h1{font-family:'Bebas Neue';font-size:clamp(38px,5.6vw,72px);line-height:0.98;text-transform:uppercase;margin-bottom:22px;}
.hero .lead{font-size:18px;line-height:1.65;color:#c9c2b0;max-width:520px;margin-bottom:34px;}
.hero-ctas{display:flex;gap:18px;flex-wrap:wrap;align-items:center;}
.hero-microcopy{width:100%;margin-top:16px;font-size:12.5px;color:var(--silver-dim);}
.hero-img{aspect-ratio:4/5;overflow:hidden;border:1px solid var(--line);}
.hero-img img{width:100%;height:100%;object-fit:cover;filter:grayscale(25%);}

section{position:relative;padding:110px 0;}
.section-head{max-width:660px;margin:0 auto 56px;text-align:center;}
.section-head .kicker{font-size:12px;font-weight:700;letter-spacing:3px;text-transform:uppercase;color:var(--silver-hi);margin-bottom:16px;display:flex;align-items:center;justify-content:center;gap:12px;}
.section-head h2{font-family:'Bebas Neue';font-size:clamp(30px,4.2vw,50px);text-transform:uppercase;line-height:1.04;}
.section-head p{margin-top:20px;color:#a49d8c;font-size:16px;line-height:1.7;max-width:600px;margin-left:auto;margin-right:auto;}
.intro-copy{max-width:760px;margin:0 auto 56px;color:#b9b2a0;font-size:16px;line-height:1.85;}
.intro-copy p{margin-bottom:16px;}
.intro-copy a{color:var(--silver-hi);text-decoration:underline;text-underline-offset:2px;}
.intro-copy a:hover{color:var(--silver);}

.reveal{opacity:0;transform:translateY(40px);transition:opacity .9s ease, transform .9s ease;}
.reveal.in{opacity:1;transform:translateY(0);}

/* BENEFITS */
.benefit-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:18px;}
.benefit-card{background:linear-gradient(160deg,#120f0a,#0b0a08);border:1px solid var(--line);padding:30px 20px;text-align:center;}
.benefit-card .tick{width:36px;height:36px;border-radius:50%;background:var(--silver-hi);color:#050506;display:flex;align-items:center;justify-content:center;font-weight:800;margin:0 auto 16px;}
.benefit-card p{font-size:13.5px;color:#a49d8c;line-height:1.6;}

/* PROCESS */
.process{background:var(--bg2);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;}
.step{border:1px dashed var(--line);padding:28px 20px;}
.step .sn{font-family:'Bebas Neue';font-size:42px;color:var(--silver-dim);line-height:1;margin-bottom:14px;}
.step h4{font-size:14.5px;font-weight:700;text-transform:uppercase;letter-spacing:1px;margin-bottom:8px;}
.step p{font-size:13px;color:#a49d8c;line-height:1.65;}
.step-cta{text-align:center;margin-top:46px;}

/* GALLERY */
.gallery-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;}
.gallery-grid figure{overflow:hidden;border:1px solid var(--line);aspect-ratio:1/1;margin:0;}
.gallery-grid img{width:100%;height:100%;object-fit:cover;filter:grayscale(45%);transition:transform .6s,filter .5s;}
.gallery-grid figure:hover img{transform:scale(1.1);filter:grayscale(0%);}

/* FEATURES / WARUM */
.features-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
.feature-card{background:linear-gradient(160deg,#120f0a,#0b0a08);border:1px solid var(--line);padding:34px 26px;}
.feature-card .fi{font-family:'Bebas Neue';font-size:32px;color:var(--silver-hi);margin-bottom:16px;}
.feature-card h4{font-size:15px;font-weight:700;margin-bottom:10px;text-transform:uppercase;letter-spacing:.5px;}
.feature-card p{font-size:13px;line-height:1.65;color:#a49d8c;}

/* TESTIMONIALS */
.testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.testi{background:linear-gradient(160deg,#120f0a,#0b0a08);border:1px solid var(--line);padding:30px 26px;}
.stars{color:var(--silver-hi);letter-spacing:3px;margin-bottom:16px;font-size:13px;}
.testi p.quote{font-size:14.5px;line-height:1.7;color:#dfe2e4;margin-bottom:18px;}
.testi .who{font-size:12px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--silver-dim);}

/* CONTACT */
.contact-cta-row{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-bottom:56px;}
.contact-cta{display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;padding:30px 22px;border:1px solid var(--line);background:linear-gradient(160deg,#120f0a,#0b0a08);transition:transform .3s,border-color .3s;}
.contact-cta:hover{transform:translateY(-6px);border-color:var(--silver);}
.contact-cta .cc-icon{width:44px;height:44px;border-radius:50%;background:rgba(242,246,248,0.08);display:flex;align-items:center;justify-content:center;color:var(--silver-hi);}
.contact-cta .cc-icon svg{width:19px;height:19px;}
.contact-cta.whatsapp .cc-icon{background:rgba(37,211,102,0.12);color:#25D366;}
.contact-cta h4{font-family:'Bebas Neue';font-size:18px;letter-spacing:1px;}
.contact-cta p{font-size:12.5px;color:#a49d8c;}
form{display:flex;flex-direction:column;gap:20px;max-width:640px;margin:0 auto;}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
.field{position:relative;}
input,textarea,select{width:100%;background:transparent;border:none;border-bottom:1px solid var(--line);color:#eae6dc;padding:14px 4px;font-family:'Inter',sans-serif;font-size:15px;outline:none;transition:border-color .3s;}
select{appearance:none;-webkit-appearance:none;color:#eae6dc;}
select option{background:#0a0a08;}
input:focus,textarea:focus,select:focus{border-color:var(--silver-hi);}
.field label{position:absolute;left:4px;top:14px;font-size:14px;color:#6b6250;pointer-events:none;transition:.25s;}
.field input:focus+label,.field input:not(:placeholder-shown)+label,.field textarea:focus+label,.field textarea:not(:placeholder-shown)+label{top:-14px;font-size:11px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--silver-hi);}
.select-label{font-size:11px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--silver-dim);margin-bottom:8px;display:block;}
textarea{resize:none;min-height:80px;}
.consent{display:flex;gap:12px;align-items:flex-start;font-size:12.5px;color:#a49d8c;line-height:1.6;cursor:pointer;}
.consent input[type="checkbox"]{-webkit-appearance:none;appearance:none;width:18px;height:18px;flex:0 0 auto;margin:1px 0 0;border:1px solid var(--silver-dim);border-radius:3px;background:transparent;position:relative;cursor:pointer;}
.consent input[type="checkbox"]:checked{background:var(--silver-hi);border-color:var(--silver-hi);}
.consent input[type="checkbox"]:checked::after{content:'';position:absolute;left:5px;top:1px;width:5px;height:9px;border:solid #050506;border-width:0 2px 2px 0;transform:rotate(40deg);}
#formStatus{font-size:13px;color:#a49d8c;}

/* FAQ */
.faq-item{border-top:1px solid var(--line);max-width:760px;margin:0 auto;}
.faq-item:last-child{border-bottom:1px solid var(--line);}
.faq-q{display:flex;justify-content:space-between;align-items:center;padding:24px 4px;cursor:pointer;font-size:16.5px;font-weight:600;}
.faq-q .plus{font-size:22px;color:var(--silver-hi);transition:transform .4s;}
.faq-item.open .plus{transform:rotate(135deg);}
.faq-a{max-height:0;overflow:hidden;transition:max-height .5s ease;}
.faq-item.open .faq-a{max-height:220px;}
.faq-a p{padding:0 4px 24px;color:#a49d8c;line-height:1.75;font-size:14.5px;max-width:90%;}

/* INTERNAL LINK GRID (SEO cross-linking) */
.related-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
.related-grid a{border:1px solid var(--line);padding:18px 16px;font-size:13px;font-weight:600;letter-spacing:.3px;transition:.3s;background:linear-gradient(160deg,#120f0a,#0b0a08);}
.related-grid a:hover{border-color:var(--silver);color:var(--silver-hi);}

footer{padding:50px 0 40px;border-top:1px solid var(--line);text-align:center;}
footer p{font-size:12px;color:#5c5646;margin-top:8px;}
.footer-links{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 4px;max-width:820px;margin:26px auto 0;font-size:12px;}
.footer-links a{color:var(--silver-dim);padding:4px 2px;}
.footer-links a:hover{color:var(--silver-hi);}
.footer-links .sep{color:var(--line);}

/* mobile sticky CTA bar */
.mobile-cta-bar{display:none;}

@media(max-width:1000px){
  .hero-grid{grid-template-columns:1fr;}
  .benefit-grid{grid-template-columns:repeat(2,1fr);}
  .steps,.testi-grid,.contact-cta-row,.features-grid,.related-grid{grid-template-columns:repeat(2,1fr);}
  .gallery-grid{grid-template-columns:repeat(2,1fr);}
  .form-row{grid-template-columns:1fr;}
  header{padding:16px 20px;}
  .back-link{display:none;}
}
@media(max-width:640px){
  .benefit-grid,.testi-grid,.contact-cta-row,.features-grid,.related-grid{grid-template-columns:1fr;}
  .mobile-cta-bar{
    display:flex;position:fixed;bottom:0;left:0;right:0;z-index:600;
    background:rgba(6,5,4,0.96);border-top:1px solid var(--line);padding:12px 14px;gap:10px;
    backdrop-filter:blur(6px);
  }
  .mobile-cta-bar a{flex:1;text-align:center;padding:14px 10px;font-size:12px;font-weight:700;letter-spacing:1px;text-transform:uppercase;}
  .mobile-cta-bar .mcb-primary{background:linear-gradient(120deg,var(--silver-hi),var(--silver) 60%,var(--silver-hi));color:#050506;}
  .mobile-cta-bar .mcb-whatsapp{background:#25D366;color:#06210f;display:flex;align-items:center;justify-content:center;gap:6px;flex:0 0 auto;width:52px;}
  .mobile-cta-bar .mcb-whatsapp span{display:none;}
  .mobile-cta-bar svg{width:18px;height:18px;}
  body{padding-bottom:74px;}
}