
    *, *::before, *::after { box-sizing:border-box; margin:0; padding:0; }
    :root {
      --ink:#0A0A0A; --ink-2:#1A1A1A; --ink-muted:#6B6B6B; --ink-faint:#ABABAB;
      --paper:#F5F4F0; --paper-2:#ECEAE4; --white:#FFFFFF;
      --blue:#1557FF; --blue-dark:#0A3DC2; --blue-light:#EEF2FF;
      --green:#00C48C; --green-bg:#DCFCE7; --orange:#FF6B35; --orange-bg:#FFF7ED;
      --radius-sm:8px; --radius-md:12px; --radius-lg:18px; --radius-xl:22px;
      --font-display:'Bricolage Grotesque',sans-serif; --font-body:'DM Sans',sans-serif;
      --ease-out:cubic-bezier(0.16,1,0.3,1);
    }
    html { scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
    body { font-family:var(--font-body); background:var(--paper); color:var(--ink); line-height:1.6; font-size:16px; overflow-x:hidden; }
    .wrap { max-width:1100px; margin:0 auto; padding:0 20px; }
    @media(min-width:768px){ .wrap { padding:0 36px; } }
    @media(min-width:1100px){ .wrap { padding:0 48px; } }

    /* NAV */
    nav.site-nav { position:fixed; top:0; left:0; right:0; z-index:100; padding:14px 0; transition:background 0.3s var(--ease-out),box-shadow 0.3s; }
    nav.site-nav.scrolled { background:rgba(245,244,240,0.92); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); box-shadow:0 1px 0 rgba(0,0,0,0.08); }
    .nav-inner { display:flex; align-items:center; justify-content:space-between; gap:16px; }
    .nav-logo { font-family:var(--font-display); font-weight:800; font-size:22px; color:var(--ink); text-decoration:none; letter-spacing:-0.03em; }
    .nav-logo span { color:var(--blue); }
    .nav-links { display:none; list-style:none; align-items:center; gap:32px; }
    @media(min-width:768px){ .nav-links { display:flex; } }
    .nav-links a { font-size:14px; font-weight:500; color:var(--ink-muted); text-decoration:none; transition:color 0.2s; }
    .nav-links a:hover,.nav-links a.active { color:var(--ink); }
    .nav-cta { display:none; }
    @media(min-width:768px){ .nav-cta { display:inline-flex; } }
    .btn { display:inline-flex; align-items:center; gap:8px; font-family:var(--font-body); font-weight:600; font-size:14px; padding:13px 24px; border-radius:10px; text-decoration:none; border:none; cursor:pointer; transition:transform 160ms cubic-bezier(0.23,1,0.32,1),background-color 140ms ease,box-shadow 140ms ease; white-space:nowrap; }
    .btn:active { transform:scale(0.97) !important; transition-duration:100ms; }
    .btn-primary { background:var(--blue); color:#fff !important; }
    .btn-primary:hover { background:#0A3DC2; transform:translateY(-1px); box-shadow:0 8px 24px rgba(21,87,255,0.28); }
    .btn-ghost { background:transparent; color:var(--ink); border:1.5px solid rgba(0,0,0,0.15); }
    .btn-ghost:hover { border-color:var(--ink); }
    .btn-wa { background:#25D366; color:#fff !important; }
    .btn-wa:hover { background:#1EB858; transform:translateY(-1px); box-shadow:0 8px 24px rgba(37,211,102,0.3); }
    .btn-lg { font-size:16px; padding:16px 32px; }
    .hamburger { display:flex; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:4px; }
    @media(min-width:768px){ .hamburger { display:none; } }
    .ham-line { width:24px; height:2px; background:var(--ink); border-radius:2px; transition:transform 220ms cubic-bezier(0.23,1,0.32,1),opacity 180ms ease; transform-origin:center; }
    .hamburger.open .ham-line:nth-child(1) { transform:translateY(7px) rotate(45deg); }
    .hamburger.open .ham-line:nth-child(2) { opacity:0; transform:scaleX(0); }
    .hamburger.open .ham-line:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }
    .mobile-drawer { position:fixed; inset:0; z-index:99; background:var(--paper); display:flex; flex-direction:column; padding:100px 24px 40px; transform:translateX(100%); transition:transform 0.4s var(--ease-out); }
    .mobile-drawer.open { transform:translateX(0); }
    .mobile-drawer a { font-family:var(--font-display); font-weight:700; font-size:32px; color:var(--ink); text-decoration:none; padding:14px 0; border-bottom:1px solid var(--paper-2); display:flex; align-items:center; justify-content:space-between; letter-spacing:-0.02em; }
    .mobile-drawer .drawer-cta { margin-top:32px; display:flex; flex-direction:column; gap:12px; }
    .drawer-cta .btn { justify-content:center; font-size:16px; padding:16px; }

    /* PAGE HERO */
    .page-hero { padding:110px 0 56px; background:var(--white); border-bottom:1px solid rgba(0,0,0,0.06); }
    @media(min-width:768px){ .page-hero { padding:130px 0 72px; } }
    .breadcrumb { display:flex; align-items:center; gap:8px; font-size:13px; color:var(--ink-muted); margin-bottom:24px; }
    .breadcrumb a { color:var(--ink-muted); text-decoration:none; }
    .breadcrumb a:hover { color:var(--ink); }
    .page-badge { display:inline-flex; align-items:center; gap:8px; background:var(--blue-light); color:var(--blue); border-radius:100px; padding:5px 14px; font-size:12px; font-weight:600; letter-spacing:0.04em; text-transform:uppercase; margin-bottom:16px; }
    .page-title { font-family:var(--font-display); font-weight:800; font-size:clamp(32px,7vw,56px); letter-spacing:-0.03em; line-height:1.05; margin-bottom:16px; max-width:560px; }
    .page-title em { font-style:normal; color:var(--blue); }
    .page-sub { font-size:16px; color:var(--ink-muted); line-height:1.7; max-width:500px; }

    /* SECTION */
    .section { padding:80px 0; }
    @media(min-width:768px){ .section { padding:100px 0; } }

    /* CONTACT CARDS GRID */
    .contact-grid { display:grid; gap:16px; margin-top:48px; }
    @media(min-width:560px){ .contact-grid { grid-template-columns:1fr 1fr; } }
    @media(min-width:900px){ .contact-grid { grid-template-columns:1fr 1fr 1fr 1fr; } }

    .contact-card {
      background:var(--white); border-radius:var(--radius-xl);
      padding:28px 24px; border:1px solid rgba(0,0,0,0.06);
      display:flex; flex-direction:column; gap:16px;
      transition:transform 160ms cubic-bezier(0.23,1,0.32,1),box-shadow 160ms ease;
      position:relative; overflow:hidden;
    }
    .contact-card::before { content:''; position:absolute; inset:0; opacity:0; transition:opacity 0.3s; pointer-events:none; }
    .contact-card.wa::before { background:linear-gradient(135deg,rgba(37,211,102,0.06) 0%,transparent 60%); }
    .contact-card.phone::before { background:linear-gradient(135deg,rgba(21,87,255,0.06) 0%,transparent 60%); }
    .contact-card.email::before { background:linear-gradient(135deg,rgba(255,107,53,0.06) 0%,transparent 60%); }
    .contact-card.hours::before { background:linear-gradient(135deg,rgba(0,196,140,0.06) 0%,transparent 60%); }
    @media(hover:hover){ .contact-card:hover { transform:translateY(-4px); box-shadow:0 20px 48px rgba(0,0,0,0.1); } .contact-card:hover::before { opacity:1; } }

    .contact-card-icon { width:52px; height:52px; border-radius:var(--radius-sm); display:flex; align-items:center; justify-content:center; font-size:24px; flex-shrink:0; position:relative; }
    .contact-card-icon.wa-icon { background:var(--green-bg); }
    .contact-card-icon.phone-icon { background:var(--blue-light); }
    .contact-card-icon.email-icon { background:var(--orange-bg); }
    .contact-card-icon.hours-icon { background:var(--paper-2); }

    .contact-card-body { flex:1; }
    .contact-card-label { font-size:11px; font-weight:700; color:var(--ink-faint); text-transform:uppercase; letter-spacing:0.08em; margin-bottom:6px; }
    .contact-card-title { font-family:var(--font-display); font-weight:700; font-size:18px; letter-spacing:-0.01em; margin-bottom:6px; }
    .contact-card-desc { font-size:13px; color:var(--ink-muted); line-height:1.55; margin-bottom:14px; }
    .contact-card-action { display:inline-flex; align-items:center; gap:8px; font-weight:600; font-size:14px; text-decoration:none; border-radius:100px; padding:10px 18px; transition:transform 160ms cubic-bezier(0.23,1,0.32,1),box-shadow 160ms ease; }
    .contact-card-action:active { transform:scale(0.97); }
    .wa-action { background:#25D366; color:#fff; }
    .wa-action:hover { background:#1EB858; transform:translateY(-1px); box-shadow:0 8px 20px rgba(37,211,102,0.3); }
    .phone-action { background:var(--blue); color:#fff; }
    .phone-action:hover { background:var(--blue-dark); transform:translateY(-1px); box-shadow:0 8px 20px rgba(21,87,255,0.3); }
    .email-action { background:var(--ink); color:#fff; }
    .email-action:hover { background:var(--ink-2); transform:translateY(-1px); box-shadow:0 8px 20px rgba(0,0,0,0.2); }
    .hours-detail { font-size:13px; line-height:1.7; }
    .hours-detail strong { color:var(--ink); font-weight:600; }
    .hours-detail span { color:var(--ink-muted); }

    /* TWO-COL LAYOUT */
    .contact-layout { display:grid; gap:40px; margin-top:64px; }
    @media(min-width:900px){ .contact-layout { grid-template-columns:1fr 440px; gap:64px; align-items:start; } }

    /* QUICK CONTACT FORM */
    .contact-form-card { background:var(--white); border-radius:var(--radius-xl); padding:32px 28px; border:1px solid rgba(0,0,0,0.06); box-shadow:0 4px 24px rgba(0,0,0,0.05); }
    .contact-form-card h2 { font-family:var(--font-display); font-weight:700; font-size:22px; letter-spacing:-0.02em; margin-bottom:6px; }
    .contact-form-card > p { font-size:14px; color:var(--ink-muted); margin-bottom:24px; }
    .form-group { margin-bottom:16px; }
    .field-label { display:block; font-size:13px; font-weight:600; color:var(--ink); margin-bottom:7px; }
    .field-label .optional { font-weight:400; color:var(--ink-faint); }
    input[type="text"],input[type="tel"],input[type="email"],textarea,select {
      width:100%; padding:12px 14px; border-radius:var(--radius-sm);
      border:1.5px solid var(--paper-2); background:var(--paper);
      font-family:var(--font-body); font-size:15px; color:var(--ink);
      outline:none; transition:border-color 0.2s,box-shadow 0.2s;
      appearance:none; -webkit-appearance:none;
    }
    input:focus,textarea:focus,select:focus { border-color:var(--blue); box-shadow:0 0 0 3px rgba(21,87,255,0.1); background:var(--white); }
    input::placeholder,textarea::placeholder { color:var(--ink-faint); }
    textarea { resize:vertical; min-height:110px; }
    select { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%236B6B6B' stroke-width='2' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 14px center; padding-right:40px; }
    .form-row { display:grid; gap:14px; margin-bottom:16px; }
    @media(min-width:480px){ .form-row { grid-template-columns:1fr 1fr; } }
    .form-submit-btn {
      width:100%; display:flex; align-items:center; justify-content:center; gap:10px;
      padding:16px 24px; border-radius:100px; border:none; cursor:pointer;
      font-family:var(--font-body); font-weight:700; font-size:16px;
      background:#25D366; color:#fff;
      transition:transform 160ms cubic-bezier(0.23,1,0.32,1),box-shadow 160ms ease,background 140ms;
      margin-top:8px;
    }
    .form-submit-btn:hover { background:#1EB858; transform:translateY(-2px); box-shadow:0 12px 32px rgba(37,211,102,0.3); }
    .form-submit-btn:active { transform:scale(0.98); }
    .form-note { font-size:12px; color:var(--ink-faint); text-align:center; margin-top:10px; line-height:1.5; }
    .form-divider { display:flex; align-items:center; gap:12px; margin:20px 0; }
    .form-divider::before,.form-divider::after { content:''; flex:1; height:1px; background:var(--paper-2); }
    .form-divider span { font-size:12px; color:var(--ink-faint); font-weight:500; white-space:nowrap; }

    /* RIGHT SIDEBAR */
    .contact-sidebar { display:flex; flex-direction:column; gap:20px; }
    .sidebar-block { background:var(--white); border-radius:var(--radius-xl); padding:28px 24px; border:1px solid rgba(0,0,0,0.06); }
    .sidebar-block h3 { font-family:var(--font-display); font-weight:700; font-size:18px; letter-spacing:-0.01em; margin-bottom:16px; }

    /* NAP BLOCK */
    .nap-row { display:flex; gap:12px; align-items:flex-start; margin-bottom:14px; }
    .nap-row:last-child { margin-bottom:0; }
    .nap-icon { width:36px; height:36px; border-radius:8px; display:flex; align-items:center; justify-content:center; font-size:16px; flex-shrink:0; }
    .nap-text { font-size:14px; line-height:1.55; }
    .nap-text strong { display:block; font-weight:600; color:var(--ink); font-size:13px; }
    .nap-text a { color:var(--blue); text-decoration:none; }
    .nap-text a:hover { text-decoration:underline; }

    /* SERVICE AREA BLOCK */
    .area-list { display:flex; flex-wrap:wrap; gap:8px; }
    .area-chip { font-size:12px; font-weight:600; color:var(--ink); background:var(--paper); border:1px solid var(--paper-2); border-radius:100px; padding:5px 12px; }

    /* WHAT TO EXPECT */
    .expect-list { display:flex; flex-direction:column; gap:12px; }
    .expect-row { display:flex; gap:12px; align-items:flex-start; }
    .expect-num { width:24px; height:24px; border-radius:50%; background:var(--blue); color:#fff; font-size:11px; font-weight:700; display:flex; align-items:center; justify-content:center; flex-shrink:0; margin-top:1px; }
    .expect-row p { font-size:13px; color:var(--ink-muted); line-height:1.5; }
    .expect-row strong { color:var(--ink); }

    /* DARK CTA BLOCK */
    .dark-block { background:var(--ink); border-radius:var(--radius-xl); padding:28px 24px; }
    .dark-block h3 { font-family:var(--font-display); font-weight:700; font-size:18px; color:#fff; margin-bottom:8px; letter-spacing:-0.01em; }
    .dark-block p { font-size:13px; color:rgba(255,255,255,0.6); line-height:1.55; margin-bottom:18px; }
    .dark-block .btn-wa { width:100%; justify-content:center; border-radius:var(--radius-md); padding:14px; }

    /* MAP SECTION */
    .map-section { background:var(--white); border-radius:var(--radius-xl); overflow:hidden; border:1px solid rgba(0,0,0,0.06); }
    .map-header { padding:24px 28px 20px; border-bottom:1px solid rgba(0,0,0,0.06); }
    .map-header h2 { font-family:var(--font-display); font-weight:700; font-size:20px; letter-spacing:-0.01em; margin-bottom:4px; }
    .map-header p { font-size:14px; color:var(--ink-muted); }
    .map-frame { width:100%; height:340px; border:0; display:block; }
    .map-cta { padding:20px 28px; display:flex; gap:12px; flex-wrap:wrap; }

    /* FOOTER */
    footer { background:var(--ink); color:#fff; padding:64px 0 32px; margin-top:80px; }
    .footer-grid { display:grid; gap:40px; margin-bottom:48px; }
    @media(min-width:640px){ .footer-grid { grid-template-columns:1fr 1fr; } }
    @media(min-width:900px){ .footer-grid { grid-template-columns:1.4fr 1fr 1fr 1fr; gap:48px; } }
    .footer-brand h2 { font-family:var(--font-display); font-weight:800; font-size:26px; letter-spacing:-0.03em; margin-bottom:12px; }
    .footer-brand h2 span { color:var(--blue); }
    .footer-brand p { font-size:14px; color:rgba(255,255,255,0.5); line-height:1.65; max-width:260px; }
    .footer-brand address { font-style:normal; margin-top:14px; font-size:13px; color:rgba(255,255,255,0.4); line-height:1.7; }
    .footer-col :is(h3,h4) { font-weight:600; font-size:13px; color:rgba(255,255,255,0.4); text-transform:uppercase; letter-spacing:0.06em; margin-bottom:16px; }
    .footer-col a,.footer-col p { display:block; font-size:14px; color:rgba(255,255,255,0.65); text-decoration:none; margin-bottom:10px; transition:color 0.2s; }
    .footer-col a:hover { color:#fff; }
    .footer-bottom { border-top:1px solid rgba(255,255,255,0.08); padding-top:24px; display:flex; flex-direction:column; gap:8px; font-size:13px; color:rgba(255,255,255,0.35); }
    @media(min-width:640px){ .footer-bottom { flex-direction:row; justify-content:space-between; align-items:center; } }
    .footer-bottom a { color:rgba(255,255,255,0.45); text-decoration:none; }
    .footer-bottom a:hover { color:#fff; }

    /* FAB */
    .fab-wrap { position:fixed; bottom:20px; right:20px; z-index:200; display:flex; flex-direction:column; align-items:flex-end; gap:10px; }
    .fab-items { display:flex; flex-direction:column; align-items:flex-end; gap:10px; transition:opacity 160ms ease,transform 160ms var(--ease-out); opacity:0; transform:scale(0.85) translateY(12px); pointer-events:none; }
    .fab-items.open { opacity:1; transform:scale(1) translateY(0); pointer-events:all; }
    .fab-item { display:flex; align-items:center; gap:10px; background:#fff; border-radius:100px; padding:10px 18px 10px 12px; font-size:13px; font-weight:600; color:var(--ink); text-decoration:none; box-shadow:0 8px 24px rgba(0,0,0,0.14); transition:transform 160ms cubic-bezier(0.23,1,0.32,1),box-shadow 160ms ease; white-space:nowrap; }
    .fab-item:hover { box-shadow:0 12px 32px rgba(0,0,0,0.2); transform:translateX(-4px); }
    .fab-icon { width:28px; height:28px; border-radius:50%; display:flex; align-items:center; justify-content:center; }
    .fab-btn { width:52px; height:52px; border-radius:50%; background:var(--ink); color:#fff; border:none; cursor:pointer; display:flex; align-items:center; justify-content:center; box-shadow:0 8px 24px rgba(0,0,0,0.2); transition:transform 160ms cubic-bezier(0.23,1,0.32,1); font-size:22px; }
    .fab-plus { transition:transform 0.3s var(--ease-out); display:inline-block; }
    .fab-btn.open .fab-plus { transform:rotate(45deg); }

    .fade-up { opacity:0; transform:translateY(24px); transition:opacity 0.6s var(--ease-out),transform 0.6s var(--ease-out); }
    .fade-up.visible { opacity:1; transform:translateY(0); }
    .fd1{transition-delay:0.05s;} .fd2{transition-delay:0.12s;} .fd3{transition-delay:0.2s;} .fd4{transition-delay:0.28s;}
    @media(prefers-reduced-motion:reduce){ .fade-up{opacity:1;transform:none;transition:none;} }
  