/* =============================================
   PENTAGON NEXUS – MAIN STYLESHEET v5
   Dark Black #1A1A1A | Gold #C8981E | Grey #6B7280
   ============================================= */

:root {
  --black:   #0F0F0F;
  --dark:    #1A1A1A;
  --dark2:   #242424;
  --dark3:   #2E2E2E;
  --gold:    #C8981E;
  --gold2:   #E0AA22;
  --gold3:   #F5C842;
  --grey:    #6B7280;
  --grey2:   #9CA3AF;
  --grey3:   #E5E7EB;
  --white:   #FFFFFF;
  --off:     #F8F8F8;
  --light:   #F3F0E8;
  --text:    #1A1A1A;
  --muted:   #6B7280;
  --border:  rgba(200,152,30,0.18);
  --border2: rgba(26,26,26,0.10);
  --radius:  12px;
  --shadow:  0 8px 32px rgba(0,0,0,0.10);
  --shadow2: 0 20px 60px rgba(0,0,0,0.15);
}

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; font-size:16px; }
body { font-family:'Inter','Source Sans 3',sans-serif; color:var(--text); background:var(--white); overflow-x:hidden; line-height:1.6; }
img  { max-width:100%; display:block; }
a    { text-decoration:none; color:inherit; }
h1,h2,h3,h4 { font-family:'Playfair Display',serif; line-height:1.15; }
.gold { color:var(--gold); }

/* ── SCROLL ANIMATIONS ── */
.reveal        { opacity:0; transform:translateY(36px);  transition:opacity .7s ease, transform .7s ease; }
.reveal-l      { opacity:0; transform:translateX(-36px); transition:opacity .7s ease, transform .7s ease; }
.reveal-r      { opacity:0; transform:translateX(36px);  transition:opacity .7s ease, transform .7s ease; }
.reveal-scale  { opacity:0; transform:scale(.92);        transition:opacity .6s ease, transform .6s ease; }
.reveal.on, .reveal-l.on, .reveal-r.on, .reveal-scale.on { opacity:1; transform:none; }
.d1{transition-delay:.08s} .d2{transition-delay:.16s} .d3{transition-delay:.24s} .d4{transition-delay:.32s} .d5{transition-delay:.40s}

/* ── BUTTONS ── */
.btn           { display:inline-flex; align-items:center; gap:8px; padding:13px 28px; border-radius:5px; font-size:14px; font-weight:700; letter-spacing:.04em; cursor:pointer; border:none; transition:all .22s; }
.btn-gold      { background:linear-gradient(135deg,var(--gold),var(--gold2)); color:#fff; box-shadow:0 6px 22px rgba(200,152,30,.32); }
.btn-gold:hover{ background:linear-gradient(135deg,var(--gold2),var(--gold3)); transform:translateY(-2px); box-shadow:0 10px 30px rgba(200,152,30,.42); color:#fff; }
.btn-dark      { background:var(--dark); color:#fff; box-shadow:0 6px 22px rgba(0,0,0,.22); }
.btn-dark:hover{ background:var(--dark2); transform:translateY(-2px); color:#fff; }
.btn-outline   { border:2px solid rgba(255,255,255,.4); color:#fff; background:transparent; }
.btn-outline:hover{ border-color:#fff; background:rgba(255,255,255,.1); }
.btn-outline-dark{ border:2px solid var(--border2); color:var(--dark); background:transparent; }
.btn-outline-dark:hover{ border-color:var(--gold); color:var(--gold); }
.btn svg       { width:16px; height:16px; flex-shrink:0; }

/* ── SECTION BASE ── */
.section       { padding:90px 0; }
.section-sm    { padding:60px 0; }
.container     { max-width:1220px; margin:0 auto; padding:0 24px; }
.section-label { display:inline-block; background:var(--light); border:1px solid rgba(200,152,30,.25); color:var(--gold); font-size:11px; font-weight:700; letter-spacing:.2em; text-transform:uppercase; padding:5px 16px; border-radius:20px; margin-bottom:14px; }
.section-title { font-size:38px; font-weight:700; color:var(--dark); margin-bottom:14px; }
.section-title span { color:var(--gold); }
.section-sub   { font-size:17px; color:var(--muted); line-height:1.78; max-width:620px; }
.text-center   { text-align:center; }
.text-center .section-sub { margin:0 auto; }

/* ── PAGE HERO ── */
.page-hero     { background:linear-gradient(135deg,var(--black) 0%,var(--dark2) 60%,var(--dark3) 100%); padding:160px 0 80px; text-align:center; position:relative; overflow:hidden; }
.page-hero::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse at 65% 40%,rgba(200,152,30,.10),transparent 60%); pointer-events:none; }
.page-hero-grid{ position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px); background-size:55px 55px; pointer-events:none; }
.ph-label      { display:inline-block; background:rgba(200,152,30,.15); border:1px solid rgba(200,152,30,.3); color:var(--gold); font-size:11px; font-weight:700; letter-spacing:.2em; text-transform:uppercase; padding:6px 18px; border-radius:20px; margin-bottom:16px; position:relative; z-index:1; }
.ph-title      { font-size:50px; font-weight:700; color:#fff; margin-bottom:14px; position:relative; z-index:1; line-height:1.1; }
.ph-title span { color:var(--gold); }
.ph-sub        { font-size:17px; color:rgba(255,255,255,.65); max-width:580px; margin:0 auto 20px; line-height:1.78; position:relative; z-index:1; }
.breadcrumb    { display:flex; align-items:center; justify-content:center; gap:8px; font-size:13px; color:rgba(255,255,255,.45); position:relative; z-index:1; }
.breadcrumb a  { color:rgba(255,255,255,.6); }
.breadcrumb a:hover { color:var(--gold); }
.breadcrumb span { opacity:.4; }

/* ── TRUST BAR ── */
.trust-bar     { background:var(--dark); border-top:1px solid rgba(200,152,30,.15); border-bottom:1px solid rgba(200,152,30,.15); padding:18px 0; }
.trust-inner   { display:flex; align-items:center; justify-content:space-around; flex-wrap:wrap; gap:14px; }
.trust-item    { display:flex; align-items:center; gap:9px; font-size:13px; color:rgba(255,255,255,.65); font-weight:500; }
.trust-item svg{ width:17px; height:17px; color:var(--gold); flex-shrink:0; }
.trust-item strong { color:#fff; }
.trust-sep     { width:1px; height:28px; background:rgba(255,255,255,.12); }

/* ── SERVICE CARDS ── */
.svc-card      { background:#fff; border:1px solid var(--border2); border-radius:var(--radius); padding:30px 26px; transition:transform .25s, box-shadow .25s, border-color .25s; position:relative; overflow:hidden; }
.svc-card::before { content:''; position:absolute; top:0; left:0; right:0; height:3px; background:linear-gradient(90deg,var(--gold),var(--gold2)); opacity:0; transition:opacity .25s; }
.svc-card:hover { transform:translateY(-6px); box-shadow:var(--shadow2); border-color:rgba(200,152,30,.3); }
.svc-card:hover::before { opacity:1; }
.svc-icon      { width:54px; height:54px; border-radius:13px; background:linear-gradient(135deg,var(--dark),var(--dark3)); display:flex; align-items:center; justify-content:center; margin-bottom:20px; box-shadow:0 6px 18px rgba(0,0,0,.20); }
.svc-icon svg  { width:26px; height:26px; color:var(--gold); }
.svc-cat       { font-size:10px; font-weight:700; letter-spacing:.2em; text-transform:uppercase; color:var(--grey); margin-bottom:6px; }
.svc-name      { font-family:'Playfair Display',serif; font-size:20px; font-weight:700; color:var(--dark); margin-bottom:14px; }
.svc-list      { list-style:none; }
.svc-list li   { font-size:13.5px; color:var(--muted); padding:5px 0; display:flex; align-items:flex-start; gap:8px; border-bottom:1px solid var(--grey3); }
.svc-list li:last-child { border-bottom:none; }
.svc-list li::before { content:'›'; color:var(--gold); font-size:17px; line-height:1.25; flex-shrink:0; }
.svc-link      { display:inline-flex; align-items:center; gap:5px; margin-top:16px; font-size:13.5px; font-weight:700; color:var(--dark); transition:gap .2s,color .2s; }
.svc-link:hover{ gap:9px; color:var(--gold); }

/* ── WHY CARDS ── */
.why-card      { background:#fff; border:1px solid var(--border2); border-radius:var(--radius); padding:32px 26px; text-align:center; transition:transform .25s, box-shadow .25s; }
.why-card:hover{ transform:translateY(-5px); box-shadow:var(--shadow); }
.why-icon      { width:66px; height:66px; border-radius:50%; background:var(--light); display:flex; align-items:center; justify-content:center; margin:0 auto 18px; border:2px solid rgba(200,152,30,.2); }
.why-icon svg  { width:30px; height:30px; color:var(--gold); }
.why-title     { font-family:'Playfair Display',serif; font-size:19px; font-weight:700; color:var(--dark); margin-bottom:10px; }
.why-desc      { font-size:14px; color:var(--muted); line-height:1.72; }

/* ── VALUE CARDS ── */
.val-card      { display:flex; align-items:flex-start; gap:13px; background:#fff; border:1px solid var(--border2); border-radius:10px; padding:16px; transition:box-shadow .2s,border-color .2s; }
.val-card:hover{ box-shadow:var(--shadow); border-color:rgba(200,152,30,.3); }
.val-icon      { width:40px; height:40px; min-width:40px; background:var(--light); border-radius:9px; display:flex; align-items:center; justify-content:center; }
.val-icon svg  { width:18px; height:18px; color:var(--gold); }
.val-title     { font-size:14px; font-weight:700; color:var(--dark); margin-bottom:3px; }
.val-desc      { font-size:12.5px; color:var(--muted); line-height:1.55; }

/* ── TESTIMONIAL ── */
.test-card     { background:var(--off); border:1px solid var(--border2); border-radius:var(--radius); padding:28px 24px; position:relative; }
.test-quote-mark { font-size:52px; color:var(--grey3); position:absolute; top:14px; left:20px; line-height:1; font-family:'Playfair Display',serif; }
.test-stars    { color:var(--gold); font-size:13.5px; margin-bottom:6px; }
.test-body     { font-size:15px; color:var(--text); line-height:1.78; margin:28px 0 20px; font-style:italic; }
.test-author   { display:flex; align-items:center; gap:12px; border-top:1px solid var(--grey3); padding-top:16px; }
.test-avatar   { width:44px; height:44px; border-radius:50%; background:linear-gradient(135deg,var(--dark),var(--dark3)); display:flex; align-items:center; justify-content:center; font-size:15px; font-weight:700; color:var(--gold); flex-shrink:0; }
.test-name     { font-size:14px; font-weight:700; color:var(--dark); }
.test-loc      { font-size:12px; color:var(--muted); }

/* ── PROCESS STEPS ── */
.process-wrap  { display:grid; grid-template-columns:repeat(5,1fr); gap:0; position:relative; }
.process-wrap::before { content:''; position:absolute; top:33px; left:10%; right:10%; height:2px; background:linear-gradient(90deg,transparent,var(--gold) 30%,var(--grey2) 70%,transparent); z-index:0; }
.proc-step     { text-align:center; position:relative; z-index:1; padding:0 10px; }
.proc-num      { width:66px; height:66px; border-radius:50%; background:linear-gradient(135deg,var(--dark),var(--dark3)); color:var(--gold); font-family:'Playfair Display',serif; font-size:24px; font-weight:700; display:flex; align-items:center; justify-content:center; margin:0 auto 18px; box-shadow:0 8px 24px rgba(0,0,0,.20); border:4px solid #fff; }
.proc-title    { font-size:13.5px; font-weight:700; color:var(--dark); margin-bottom:7px; }
.proc-desc     { font-size:12.5px; color:var(--muted); line-height:1.62; }

/* ── CTA BAND ── */
.cta-band      { background:linear-gradient(135deg,var(--dark),var(--dark2)); border-radius:18px; padding:50px 40px; text-align:center; position:relative; overflow:hidden; }
.cta-band::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse at 70% 50%,rgba(200,152,30,.1),transparent 60%); pointer-events:none; }
.cta-band h3   { font-size:32px; color:#fff; margin-bottom:10px; position:relative; }
.cta-band p    { font-size:16px; color:rgba(255,255,255,.68); margin-bottom:26px; position:relative; }
.cta-btns      { display:flex; gap:14px; justify-content:center; flex-wrap:wrap; position:relative; }

/* ── MAP STRIP ── */
.map-strip     { background:var(--dark); padding:28px 0; }
.map-strip-inner { display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap; }
.map-strip p   { color:rgba(255,255,255,.65); font-size:14.5px; }
.map-strip strong { color:#fff; }

/* ── GRIDS ── */
.grid-2 { display:grid; grid-template-columns:1fr 1fr; gap:28px; }
.grid-3 { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.grid-4 { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.grid-5 { display:grid; grid-template-columns:repeat(5,1fr); gap:12px; }
.gap-40 { gap:40px; } .gap-60 { gap:60px; }
.mt-14{margin-top:14px} .mt-20{margin-top:20px} .mt-28{margin-top:28px} .mt-40{margin-top:40px} .mt-52{margin-top:52px}

/* ── FORM ── */
.form-box      { background:var(--off); border:1px solid var(--border2); border-radius:16px; padding:38px; }
.form-title    { font-family:'Playfair Display',serif; font-size:24px; font-weight:700; color:var(--dark); margin-bottom:24px; }
.form-row      { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.form-group    { margin-bottom:18px; }
.form-group label { display:block; font-size:12.5px; font-weight:700; color:var(--dark); margin-bottom:7px; letter-spacing:.04em; }
.form-group input, .form-group select, .form-group textarea { width:100%; padding:12px 15px; border:1.5px solid var(--grey3); border-radius:7px; font-size:15px; font-family:inherit; color:var(--text); background:#fff; transition:border-color .2s,box-shadow .2s; outline:none; }
.form-group input:focus, .form-group select:focus, .form-group textarea:focus { border-color:var(--gold); box-shadow:0 0 0 3px rgba(200,152,30,.12); }
.form-group textarea { resize:vertical; min-height:118px; }
.form-hp       { display:none; }
.form-submit   { width:100%; padding:15px; background:linear-gradient(135deg,var(--dark),var(--dark3)); color:#fff; border:none; border-radius:7px; font-size:16px; font-weight:700; cursor:pointer; font-family:inherit; letter-spacing:.05em; transition:opacity .2s,transform .15s; box-shadow:0 6px 20px rgba(0,0,0,.20); }
.form-submit:hover:not(:disabled) { opacity:.9; transform:translateY(-1px); }
.form-submit:disabled { opacity:.65; cursor:not-allowed; }
.form-msg      { margin-top:14px; padding:13px 16px; border-radius:7px; font-size:14px; display:none; }
.form-msg.ok   { background:#f0fdf4; color:#14532d; border:1px solid #bbf7d0; }
.form-msg.err  { background:#fff1f2; color:#881337; border:1px solid #fecdd3; }

/* ── CONTACT INFO CARDS ── */
.ci-card       { display:flex; align-items:flex-start; gap:14px; background:var(--off); border:1px solid var(--border2); border-radius:10px; padding:18px; margin-bottom:16px; transition:border-color .2s; }
.ci-card:hover { border-color:rgba(200,152,30,.3); }
.ci-ic         { width:46px; height:46px; min-width:46px; background:var(--dark); border-radius:10px; display:flex; align-items:center; justify-content:center; box-shadow:0 4px 12px rgba(0,0,0,.18); }
.ci-ic svg     { width:21px; height:21px; color:var(--gold); }
.ci-lbl        { font-size:10.5px; color:var(--muted); letter-spacing:.12em; text-transform:uppercase; margin-bottom:3px; font-weight:600; }
.ci-val        { font-size:14.5px; color:var(--dark); font-weight:500; line-height:1.55; }
.ci-val a      { color:var(--gold); font-weight:600; }
.ci-val a:hover{ color:var(--dark); }

/* ── MAP ── */
.map-embed     { border-radius:12px; overflow:hidden; border:1px solid var(--border2); margin-top:20px; }
.map-embed iframe { width:100%; height:220px; border:none; display:block; }

/* ── WA FLOAT ── */
.wa-float      { position:fixed; bottom:28px; right:28px; z-index:9999; background:#25D366; color:#fff; border-radius:50%; width:56px; height:56px; display:flex; align-items:center; justify-content:center; box-shadow:0 6px 22px rgba(37,211,102,.44); transition:transform .22s; }
.wa-float:hover{ transform:scale(1.12); }
.wa-float svg  { width:28px; height:28px; }
.wa-tooltip    { position:absolute; right:64px; background:var(--dark); color:#fff; font-size:12px; font-weight:600; padding:6px 12px; border-radius:6px; white-space:nowrap; opacity:0; pointer-events:none; transition:opacity .2s; }
.wa-float:hover .wa-tooltip { opacity:1; }

/* ── RESPONSIVE ── */
@media(max-width:1100px){ .grid-4{grid-template-columns:repeat(2,1fr);} .process-wrap{grid-template-columns:repeat(3,1fr);} .process-wrap::before{display:none;} }
@media(max-width:860px){ .grid-2,.grid-3{grid-template-columns:1fr;} .form-row{grid-template-columns:1fr;} .ph-title{font-size:34px;} .section-title{font-size:28px;} .section{padding:60px 0;} .cta-band{padding:36px 24px;} .map-strip-inner{flex-direction:column;text-align:center;} }
@media(max-width:600px){ .grid-4{grid-template-columns:1fr 1fr;} .grid-5{grid-template-columns:1fr 1fr;} .process-wrap{grid-template-columns:1fr 1fr;} .btn{padding:11px 20px;font-size:13.5px;} }
