*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

/* ===========================
   CONTACT PAGE
=========================== */
.contact-page{background:#f7f9fd;color:#142238}
.contact-hero{padding:88px 0 95px;background:radial-gradient(circle at 85% 0,#d7e7ff 0,transparent 28%),linear-gradient(135deg,#f4f8ff,#fff)}
.contact-hero .wrap{max-width:1180px}.contact-kicker,.eyebrow{display:inline-block;color:#2864dc;font-size:12px;font-weight:800;letter-spacing:.11em;text-transform:uppercase}.contact-kicker:before{content:"";display:inline-block;width:9px;height:9px;margin-right:8px;border-radius:50%;background:#1bb480;box-shadow:0 0 0 5px rgba(27,180,128,.12)}
.contact-hero h1{max-width:850px;margin:16px 0 20px;font-size:clamp(42px,5.5vw,68px);line-height:1.05;letter-spacing:-.055em;color:#10223d}.contact-hero h1 span{color:#2864dc}.contact-hero p{max-width:690px;color:#53647a;font-size:18px;line-height:1.7}
.contact-section{padding:78px 0 94px}.contact-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:64px;align-items:start}.contact-details{padding:25px 0}.contact-details h2,.contact-form-card h2{margin:12px 0;color:#10223d;font-size:clamp(28px,3vw,38px);letter-spacing:-.04em}.contact-details>p:not(.eyebrow){max-width:405px;margin-bottom:33px;color:#617188;line-height:1.7}
.contact-method{display:flex;gap:14px;align-items:flex-start;max-width:410px;margin:19px 0}.contact-icon{display:grid;place-items:center;flex:0 0 37px;height:37px;border-radius:10px;background:#e8f0ff;color:#2764d8;font-size:11px;font-weight:800}.contact-method strong,.contact-method span{display:block}.contact-method strong{margin:2px 0 4px;color:#1c2d47;font-size:15px}.contact-method div span{color:#708096;font-size:13px;line-height:1.5}.contact-whatsapp{display:inline-flex;align-items:center;gap:10px;margin-top:24px;padding:13px 17px;border:1px solid #cddcf5;border-radius:9px;color:#1c56c5;font-size:14px;font-weight:700;text-decoration:none}.contact-whatsapp span,.contact-submit span{font-size:19px;line-height:0}.contact-whatsapp:hover{background:#edf4ff}
.contact-form-card{padding:36px;border:1px solid #dfe7f1;border-radius:18px;background:#fff;box-shadow:0 20px 50px rgba(27,55,93,.09)}.form-intro{margin-bottom:25px;color:#718096;font-size:14px}.contact-form-card form{display:grid;gap:16px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.contact-form-card label{display:grid;gap:7px;color:#253650;font-size:13px;font-weight:700}.contact-form-card input,.contact-form-card select,.contact-form-card textarea{width:100%;padding:13px 14px;border:1px solid #d7e0eb;border-radius:8px;outline:none;background:#fff;color:#253650;font:400 14px Inter,sans-serif;transition:border-color .2s,box-shadow .2s}.contact-form-card textarea{resize:vertical;min-height:124px}.contact-form-card input:focus,.contact-form-card select:focus,.contact-form-card textarea:focus{border-color:#4d82e3;box-shadow:0 0 0 4px rgba(50,104,220,.1)}.optional{color:#91a0b3;font-weight:500}.human-check{grid-template-columns:18px 1fr;align-items:center;gap:9px!important;color:#64748b!important;font-size:12px!important;font-weight:600!important}.human-check input{width:17px;height:17px;padding:0;accent-color:#2864dc}.honeypot{position:absolute;left:-9999px;opacity:0;pointer-events:none}.contact-submit{display:inline-flex;align-items:center;justify-content:center;gap:11px;padding:14px 21px;border:0;border-radius:9px;background:#2864dc;color:#fff;cursor:pointer;font:700 14px Inter,sans-serif;box-shadow:0 12px 24px rgba(40,100,220,.22)}.contact-submit:hover{background:#1e56c8}.form-message{min-height:19px;color:#63748a;font-size:13px;line-height:1.5}.form-message.error{color:#bd453d}.form-message.success{color:#16805e}.contact-footer{padding:24px 0;background:#10223d;color:#c4d1e2;font-size:13px}.contact-footer .wrap{display:flex;justify-content:space-between;gap:20px}.contact-footer strong{color:#fff}
@media(max-width:900px){.contact-layout{grid-template-columns:1fr;gap:24px}.contact-section{padding-top:55px}.contact-details{padding-top:0}}@media(max-width:560px){.contact-hero{padding:62px 0 66px}.contact-hero p{font-size:16px}.contact-form-card{padding:25px 19px}.form-grid{grid-template-columns:1fr}.contact-footer .wrap{flex-direction:column;gap:8px}}

/* ===========================
   ABOUT PAGE
=========================== */
.about-page .container{width:min(1180px,92%);margin:auto}
.about-page .hero{padding:90px 0;background:linear-gradient(135deg,#eef4ff,#fff)}
.about-page .hero h1{font-size:58px;margin-bottom:20px}
.about-page .hero p{font-size:20px;max-width:850px;color:#555}
.about-page .grid{display:grid;grid-template-columns:1fr 1fr;gap:35px;padding:80px 0}
.about-page .card{background:#fff;padding:32px;border-radius:22px;box-shadow:0 12px 35px rgba(0,0,0,.08)}
.about-page .timeline{padding:80px 0}
.about-page .item{display:flex;gap:25px;margin-bottom:35px}
.about-page .year{min-width:90px;font-weight:800;color:#2563eb}
.about-page footer{background:#111827;color:#fff;padding:35px 0;margin-top:60px}
@media(max-width:900px){.about-page .grid{grid-template-columns:1fr}.about-page .hero h1{font-size:42px}}


/* ===========================
   STEPLEDGER
=========================== */
:root { --sl-ink: #162235; --sl-navy: #0d1f38; --sl-blue: #2864dc; --sl-mint: #13a875; --sl-amber: #e6a125; --sl-red: #d65a55; --sl-line: #dfe6ef; }
.sl-page { color: var(--sl-ink); overflow: hidden; }
.sl-hero { position: relative; padding: 86px 0 104px; background: radial-gradient(circle at 88% 12%, #ddecff 0, transparent 27%), linear-gradient(125deg, #f5f8ff 0%, #f9fbff 48%, #edf5ff 100%); }
.sl-hero:after { content:""; position:absolute; width:520px; height:520px; border:1px solid #bdd4fa; border-radius:50%; right:-245px; bottom:-350px; }
.sl-grid { position: relative; z-index: 1; display:grid; grid-template-columns: .85fr 1.15fr; gap: 60px; align-items:center; }
.sl-kicker { display:inline-flex; align-items:center; gap:8px; color:var(--sl-blue); font-size:13px; letter-spacing:.1em; text-transform:uppercase; font-weight:800; }
.sl-kicker:before { content:""; width:9px; height:9px; border-radius:50%; background:#35c995; box-shadow:0 0 0 5px rgba(53,201,149,.14); }
.sl-copy h1 { margin:17px 0 20px; font-size:clamp(42px, 5vw, 68px); line-height:1.04; letter-spacing:-.055em; color:var(--sl-navy); }
.sl-copy h1 span { color:var(--sl-blue); }
.sl-copy > p { max-width:535px; color:#506176; font-size:18px; line-height:1.75; }
.sl-actions { display:flex; flex-wrap:wrap; gap:13px; margin-top:29px; }
.sl-button { display:inline-flex; align-items:center; justify-content:center; padding:14px 21px; border-radius:10px; background:var(--sl-blue); color:#fff; text-decoration:none; font-weight:700; box-shadow:0 12px 24px rgba(40,100,220,.22); }
.sl-button.ghost { background:#fff; color:var(--sl-navy); border:1px solid var(--sl-line); box-shadow:none; }
.sl-proof { display:flex; gap:24px; margin-top:30px; color:#607087; font-size:13px; font-weight:600; }
.sl-proof span { display:flex; align-items:center; gap:7px; }.sl-proof i { width:7px; height:7px; display:inline-block; background:#26b380; border-radius:50%; }
.sl-dashboard { padding:16px; border-radius:18px; background:#edf2fb; box-shadow:0 28px 60px rgba(27,57,99,.2); transform:perspective(1200px) rotateY(-3deg) rotateX(1deg); }
.dash-inner { overflow:hidden; border-radius:11px; background:#fff; box-shadow:0 2px 9px rgba(25,55,90,.08); }
.dash-top { height:45px; display:flex; align-items:center; justify-content:space-between; padding:0 17px; border-bottom:1px solid #e9eef4; color:#8090a5; font-size:10px; font-weight:700; }
.dash-brand { color:#1c57c7; font-size:13px; }.dash-brand b { color:#13233c; }.dash-user { display:flex; align-items:center; gap:7px; }.avatar { display:inline-grid; place-items:center; width:23px; height:23px; border-radius:50%; background:#dbe9ff; color:#2759ad; font-size:9px; }
.dash-body { display:grid; grid-template-columns:136px 1fr; min-height:350px; }.dash-side { padding:16px 11px; background:#f7f9fc; border-right:1px solid #edf0f5; }.dash-side p { margin:0 0 14px 8px; color:#97a4b6; font-size:8px; text-transform:uppercase; letter-spacing:.09em; }.dash-nav { padding:9px 9px; margin:4px 0; border-radius:6px; font-size:10px; color:#617086; }.dash-nav.active { background:#e6efff; color:#2561cd; font-weight:700; }
.dash-main { padding:20px; }.dash-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }.dash-head h3 { margin:0 0 5px; font-size:17px; }.dash-head p { margin:0; color:#78869a; font-size:10px; }.dash-filter { padding:7px 9px; color:#4e617c; border:1px solid #e3e9f1; border-radius:6px; font-size:9px; }
.stat-row { display:grid; grid-template-columns:repeat(3, 1fr); gap:9px; margin:18px 0; }.mini-stat { padding:11px; border:1px solid #e7edf4; border-radius:8px; }.mini-stat span { display:block; color:#8090a4; font-size:9px; }.mini-stat b { display:block; margin-top:6px; font-size:17px; }.mini-stat em { color:#17a573; font-size:8px; font-style:normal; }
.shipment-list { border:1px solid #e7edf4; border-radius:8px; overflow:hidden; }.shipment-title, .shipment { display:grid; grid-template-columns:1.2fr .9fr .85fr .8fr; align-items:center; gap:7px; padding:10px 11px; font-size:9px; }.shipment-title { background:#f8fafc; color:#92a0b2; text-transform:uppercase; letter-spacing:.06em; font-size:8px; }.shipment { border-top:1px solid #eef2f6; color:#536278; }.shipment strong { color:#24334a; font-size:10px; }.status { display:inline-flex; width:max-content; align-items:center; gap:4px; padding:4px 6px; border-radius:999px; font-size:8px; font-weight:700; }.status:before { content:""; width:4px; height:4px; border-radius:50%; background:currentColor; }.ready { color:#117a5c; background:#def7ec; }.transit { color:#a5680a; background:#fff3d9; }.delivery { color:#2962c7; background:#e6efff; }
.sl-section { padding:94px 0; }.sl-heading { max-width:655px; margin-bottom:43px; }.sl-heading small { color:var(--sl-blue); font-weight:800; letter-spacing:.1em; text-transform:uppercase; }.sl-heading h2 { margin:12px 0; color:var(--sl-navy); font-size:clamp(32px, 4vw, 48px); letter-spacing:-.045em; }.sl-heading p { color:#607087; font-size:17px; line-height:1.7; }
.sl-features { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }.sl-card { padding:27px; border:1px solid var(--sl-line); border-radius:15px; background:#fff; }.sl-icon { display:grid; place-items:center; width:44px; height:44px; margin-bottom:19px; border-radius:12px; background:#eaf1ff; color:var(--sl-blue); font-size:20px; font-weight:800; }.sl-card h3 { margin-bottom:10px; font-size:18px; color:var(--sl-navy); }.sl-card p { color:#627187; font-size:14px; line-height:1.65; }
.sl-workflow { background:var(--sl-navy); color:#fff; }.sl-workflow .sl-heading h2 { color:#fff; }.sl-workflow .sl-heading p { color:#b9c8dc; }.steps { display:grid; grid-template-columns:repeat(4,1fr); position:relative; gap:22px; }.steps:before { content:""; position:absolute; height:1px; background:#3e5775; top:31px; left:9%; right:9%; }.step { position:relative; z-index:1; }.step-no { display:grid; place-items:center; width:62px; height:62px; margin-bottom:20px; border-radius:50%; border:7px solid var(--sl-navy); background:#254a7d; color:#fff; font:500 14px 'DM Mono', monospace; }.step:nth-child(2) .step-no { background:#1e70d5; }.step:nth-child(3) .step-no { background:#19a676; }.step:nth-child(4) .step-no { background:#dc9b27; }.step h3 { font-size:17px; margin-bottom:8px; }.step p { color:#b8c7d9; font-size:14px; line-height:1.6; }
.sl-report { display:grid; grid-template-columns:.9fr 1.1fr; gap:68px; align-items:center; }.report-card { padding:26px; border-radius:18px; background:#fff; border:1px solid var(--sl-line); box-shadow:0 20px 45px rgba(20,42,72,.08); }.report-top { display:flex; align-items:center; justify-content:space-between; }.report-top h3 { font-size:16px; }.report-top span { color:#1a956b; font-size:11px; font-weight:700; }.bar-chart { display:flex; height:158px; align-items:flex-end; gap:13px; padding:18px 3px 0; border-bottom:1px solid #e5ebf2; }.bar { flex:1; position:relative; border-radius:5px 5px 0 0; background:#bcd2fb; }.bar:nth-child(2),.bar:nth-child(5) { background:#2764d8; }.bar:after { content:attr(data-label); position:absolute; bottom:-22px; left:50%; transform:translateX(-50%); color:#8593a6; font-size:9px; }.report-metrics { display:grid; grid-template-columns:1fr 1fr; gap:11px; margin-top:38px; }.report-metrics div { padding:11px; background:#f7f9fc; border-radius:8px; }.report-metrics span { color:#77869a; font-size:10px; }.report-metrics b { display:block; margin-top:5px; font-size:18px; }
.sl-cta { padding:85px 0; text-align:center; background:linear-gradient(135deg,#e7f0ff,#f9fbff); }.sl-cta h2 { color:var(--sl-navy); font-size:clamp(32px,4vw,48px); letter-spacing:-.045em; }.sl-cta p { max-width:570px; margin:15px auto 26px; color:#607087; font-size:17px; line-height:1.65; }
.sl-footer { padding:25px 0; background:#0d1f38; color:#aebfd5; font-size:13px; }.sl-footer .wrap { display:flex; justify-content:space-between; gap:16px; }.sl-footer b { color:#fff; }
@media (max-width:900px) { .sl-grid,.sl-report { grid-template-columns:1fr; }.sl-dashboard { max-width:670px; }.sl-features { grid-template-columns:1fr 1fr; }.steps { grid-template-columns:1fr 1fr; }.steps:before { display:none; } }
@media (max-width:580px) { .sl-hero { padding:62px 0 72px; }.sl-dashboard { padding:8px; transform:none; }.dash-body { grid-template-columns:1fr; }.dash-side { display:none; }.dash-main { padding:13px; }.shipment-title,.shipment { grid-template-columns:1.2fr .8fr .9fr; }.shipment > :nth-child(2) { display:none; }.sl-features,.steps { grid-template-columns:1fr; }.sl-section { padding:65px 0; }.sl-proof { gap:12px; flex-wrap:wrap; }.sl-footer .wrap { flex-direction:column; }.sl-actions { flex-direction:column; align-items:stretch; }.sl-button { width:100%; } }
/* Services page styles */
.services-hero { padding: 90px 0; background: linear-gradient(135deg, #eef4ff, #fff); }
.services-hero h1 { font-size: 58px; margin-bottom: 20px; color: var(--text); }
.services-hero p { font-size: 20px; max-width: 850px; color: var(--muted); }
.services-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 30px; padding: 80px 0; }
.service-card { background: #fff; padding: 40px; border-radius: 22px; box-shadow: 0 12px 35px rgba(0, 0, 0, 0.08); transition: transform 0.3s, box-shadow 0.3s; border-left: 4px solid var(--primary); }
.service-card:hover { transform: translateY(-8px); box-shadow: 0 20px 50px rgba(0, 0, 0, 0.12); }
.service-icon { width: 60px; height: 60px; background: linear-gradient(135deg, var(--primary), var(--primary-light)); border-radius: 16px; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 32px; margin-bottom: 20px; }
.service-card h3 { font-size: 24px; margin-bottom: 15px; color: var(--text); }
.service-card p { font-size: 16px; color: var(--muted); line-height: 1.6; margin-bottom: 20px; }
.service-features { list-style: none; padding: 0; margin: 0; }
.service-features li { padding: 8px 0; color: var(--muted); font-size: 15px; display: flex; align-items: center; gap: 10px; }
.service-features li:before { content: "✓"; color: var(--primary); font-weight: bold; font-size: 18px; }
.service-cta { display: inline-block; margin-top: 20px; padding: 10px 20px; background: linear-gradient(135deg, var(--primary), var(--primary-light)); color: #fff; text-decoration: none; border-radius: 999px; font-weight: 600; font-size: 14px; transition: transform 0.25s, box-shadow 0.25s; }
.service-cta:hover { transform: translateY(-2px); box-shadow: 0 10px 25px rgba(156, 79, 37, 0.25); }
.section-title { text-align: center; margin-bottom: 60px; }
.section-title .badge { display: inline-block; margin-bottom: 15px; }
.section-title h2 { font-size: 48px; margin-bottom: 15px; color: var(--text); }
.section-title p { font-size: 18px; color: var(--muted); max-width: 600px; margin: 0 auto; }
.process-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 40px; padding: 80px 0; }
.process-step { text-align: center; }
.step-number { width: 70px; height: 70px; background: linear-gradient(135deg, var(--primary), var(--primary-light)); color: #fff; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 32px; font-weight: 800; margin: 0 auto 20px; }
.process-step h3 { font-size: 22px; margin-bottom: 12px; color: var(--text); }
.process-step p { font-size: 16px; color: var(--muted); line-height: 1.6; }
.tech-stack { background: #fff; padding: 60px 40px; border-radius: 22px; box-shadow: 0 12px 35px rgba(0, 0, 0, 0.08); margin: 80px 0; }
.tech-stack h3 { font-size: 28px; margin-bottom: 30px; color: var(--text); }
.tech-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 20px; }
.tech-item { padding: 15px; background: #f8fbff; border-radius: 12px; text-align: center; font-weight: 600; color: var(--primary); font-size: 15px; }
.cta-section { background: linear-gradient(135deg, var(--primary), var(--primary-light)); color: #fff; padding: 80px 40px; border-radius: 22px; text-align: center; margin: 80px 0; }
.cta-section h2 { font-size: 42px; margin-bottom: 20px; color: #fff; }
.cta-section p { font-size: 18px; color: rgba(255, 255, 255, 0.9); margin-bottom: 30px; max-width: 600px; margin-left: auto; margin-right: auto; }
.cta-button { display: inline-block; padding: 15px 35px; background: #fff; color: var(--primary); text-decoration: none; border-radius: 999px; font-weight: 700; font-size: 16px; transition: transform 0.25s, box-shadow 0.25s; }
.cta-button:hover { transform: translateY(-2px); box-shadow: 0 15px 35px rgba(0, 0, 0, 0.2); }
@media (max-width: 900px) {
    .services-hero h1 { font-size: 42px; }
    .section-title h2 { font-size: 36px; }
    .services-grid { grid-template-columns: 1fr; }
    .process-grid { grid-template-columns: 1fr; }
    .cta-section h2 { font-size: 32px; }
    .tech-list { grid-template-columns: repeat(2, 1fr); }
}

:root{
    --primary:#9C4F25;
    --primary-light:#C67A44;
    --text:#2b211d;
    --muted:#6d625c;
    --bg:#fbf8f5;
    --white:#ffffff;
    --radius:22px;
}

html{
    scroll-behavior:smooth;
}

body{
    font-family:Inter,sans-serif;
    background:var(--bg);
    color:var(--text);
    padding-top:88px;
}

.wrap{
    width:min(1180px,92%);
    margin:auto;
}

/* ===========================
   NAVBAR
=========================== */

.navbar{
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:88px;
    background:rgba(255,255,255,.90);
    backdrop-filter:blur(18px);
    border-bottom:1px solid rgba(0,0,0,.06);
    z-index:1000;
}

.navbar-container{
    height:100%;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:40px;
}

.navbar-brand{
    display:flex;
    align-items:center;
    flex-shrink:0;
}

.navbar-logo{
    height:80px;
    width:auto;
    display:block;
    object-fit:contain;
    transition:.3s;
}

.navbar-logo:hover{
    transform:scale(1.03);
}

.navbar-menu{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:36px;
    list-style:none;
    margin:0;
    padding:0;
    flex:1;
}

.navbar-menu li{
    position:relative;
}

.navbar-menu a{
    text-decoration:none;
    color:var(--text);
    font-size:15px;
    font-weight:600;
    transition:.25s;
}

.navbar-menu a:hover,
.navbar-menu a.active{
    color:var(--primary);
}

.mobile-menu{display:none;}

.dropdown>a{
    display:flex;
    align-items:center;
    gap:6px;
}

.dropdown-menu{
    position:absolute;
    top:42px;
    left:0;
    width:240px;
    list-style:none;
    padding:10px 0;
    border-radius:16px;
    background:#fff;
    box-shadow:0 20px 50px rgba(0,0,0,.08);
    opacity:0;
    visibility:hidden;
    transform:translateY(10px);
    transition:.25s;
}

.dropdown:hover .dropdown-menu{
    opacity:1;
    visibility:visible;
    transform:translateY(0);
}

.dropdown-menu a{
    display:block;
    padding:12px 18px;
}

.btn-primary,
.btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:13px 26px;
    border-radius:999px;
    text-decoration:none;
    color:#fff;
    font-weight:700;
    background:linear-gradient(135deg,var(--primary),var(--primary-light));
    transition:.25s;
}

.btn-primary:hover,
.btn:hover{
    transform:translateY(-2px);
    box-shadow:0 15px 30px rgba(156,79,37,.25);
}

.whatsapp-connect{
    position:fixed;
    right:24px;
    bottom:24px;
    z-index:1001;
    display:inline-flex;
    align-items:center;
    gap:10px;
    padding:14px 20px;
    border-radius:999px;
    background:#25d366;
    color:#fff;
    font-size:15px;
    font-weight:700;
    text-decoration:none;
    box-shadow:0 12px 28px rgba(37,211,102,.35);
    transition:transform .25s, box-shadow .25s;
}

.whatsapp-connect:hover{
    transform:translateY(-3px);
    box-shadow:0 16px 32px rgba(37,211,102,.45);
}

.whatsapp-connect svg{
    width:22px;
    height:22px;
    fill:currentColor;
}

/* HERO */

.hero{
    position:relative;
    overflow:hidden;
    padding:110px 0;
}

.blob{
    position:absolute;
    width:420px;
    height:420px;
    border-radius:50%;
    filter:blur(90px);
    z-index:0;
}

.b1{left:-140px;top:-100px;background:#9c4f2525;}
.b2{right:-140px;bottom:-100px;background:#c67a4425;}

.hero-grid{
    position:relative;
    z-index:1;
    display:grid;
    grid-template-columns:1.2fr .8fr;
    gap:60px;
    align-items:center;
}

.badge{
    display:inline-block;
    padding:8px 14px;
    border-radius:999px;
    background:#f3e7df;
    color:var(--primary);
}

h1{
    font-size:66px;
    line-height:1.05;
    margin:22px 0;
}

h1 span{
    color:var(--primary);
}

p{
    font-size:20px;
    color:var(--muted);
}

.actions{
    display:flex;
    gap:18px;
    margin:34px 0;
}

.outline{
    padding:13px 24px;
    border-radius:999px;
    border:2px solid var(--primary);
    color:var(--primary);
    text-decoration:none;
    font-weight:700;
}

.trust{
    display:flex;
    gap:30px;
}

.trust div{
    display:flex;
    flex-direction:column;
}

.dashboard .window{
    background:#fff;
    padding:28px;
    border-radius:24px;
    box-shadow:0 20px 60px rgba(0,0,0,.08);
}

.topbar{
    display:flex;
    gap:8px;
    margin-bottom:18px;
}

.topbar span{
    width:12px;
    height:12px;
    border-radius:50%;
    background:#ddd;
}

.metric{
    display:flex;
    justify-content:space-between;
    background:#f8fbff;
    padding:14px;
    border-radius:12px;
    margin-top:12px;
}

.section{
    padding:90px 0;
}

.about-grid{
    display:grid;
    grid-template-columns:1.2fr .8fr;
    gap:50px;
}

.about-card{
    background:#fff;
    padding:30px;
    border-radius:22px;
    box-shadow:0 15px 40px rgba(0,0,0,.08);
}

.timeline-item{
    display:flex;
    justify-content:space-between;
    padding:18px 0;
    border-bottom:1px solid #eee;
}

@media(max-width:900px){

    body{
        padding-top:80px;
    }

    .hero-grid,
    .about-grid{
        grid-template-columns:1fr;
    }

    .navbar-menu,
    .btn-primary{
        display:none;
    }

    .hamburger{
        display:flex;
        flex-direction:column;
        gap:5px;
        background:none;
        border:none;
        cursor:pointer;
        padding:6px;
        z-index:1100;
    }
    .hamburger span{
        display:block;
        width:26px;
        height:3px;
        background:#1e1b4b;
        border-radius:3px;
        transition:.3s;
    }
    .hamburger.active span:nth-child(1){transform:rotate(45deg) translate(5px,6px)}
    .hamburger.active span:nth-child(2){opacity:0}
    .hamburger.active span:nth-child(3){transform:rotate(-45deg) translate(5px,-6px)}

    .mobile-menu{
        display:none;
        position:fixed;
        top:88px;left:0;right:0;bottom:0;
        background:rgba(255,255,255,.97);
        backdrop-filter:blur(18px);
        z-index:999;
        padding:24px;
        overflow-y:auto;
    }
    .mobile-menu.open{display:block}
    .mobile-menu ul{list-style:none;padding:0;margin:0}
    .mobile-menu li{border-bottom:1px solid #e2e8f0}
    .mobile-menu a{
        display:block;padding:14px 0;text-decoration:none;
        color:#1e293b;font-size:16px;font-weight:600;
    }
    .mobile-menu a:hover{color:#4c1d95}
    .mobile-dropdown-menu{display:none;padding-left:16px}
    .mobile-dropdown-menu.open{display:block}
    .mobile-dropdown-menu li{border:none}
    .mobile-dropdown-menu a{font-size:14px;font-weight:500;padding:10px 0}
    .mobile-cta{
        display:inline-block!important;
        text-align:center;
        margin-top:16px;
        padding:12px 24px!important;
        border-radius:30px;
        color:#fff!important;
    }

    .navbar-logo{
        height:52px;
    }

    h1{
        font-size:42px;
    }

    .trust{
        flex-wrap:wrap;
    }

    .whatsapp-connect{
        right:16px;
        bottom:16px;
        padding:14px;
    }

    .whatsapp-connect span{
        display:none;
    }
}

/* ===========================
   CROISSANCE UNIFIED PALETTE
=========================== */
:root{
    --sl-ink:#33231d;
    --sl-navy:#3a2417;
    --sl-blue:#9c4f25;
    --sl-mint:#16805e;
    --sl-amber:#c67a44;
    --sl-line:#ead8ca;
}

/* About */
.about-page .hero{background:linear-gradient(135deg,#fbf0e7,#fff)}
.about-page .year{color:var(--primary)}
.about-page footer{background:#3a2417}

/* Contact */
.contact-page{background:#fbf8f5;color:var(--text)}
.contact-hero{background:radial-gradient(circle at 85% 0,#f1d6bf 0,transparent 28%),linear-gradient(135deg,#fdf4ec,#fff)}
.contact-kicker,.eyebrow{color:var(--primary)}
.contact-kicker:before{background:var(--primary-light);box-shadow:0 0 0 5px rgba(198,122,68,.14)}
.contact-hero h1,.contact-details h2,.contact-form-card h2{color:#3a2417}
.contact-hero h1 span{color:var(--primary)}
.contact-hero p,.contact-details>p:not(.eyebrow){color:var(--muted)}
.contact-icon{background:#f7e7d9;color:var(--primary)}
.contact-method strong,.contact-form-card label{color:#3a2417}
.contact-method div span,.form-intro,.human-check,.form-message{color:var(--muted)}
.contact-whatsapp{border-color:#e7cbb6;color:var(--primary)}
.contact-whatsapp:hover{background:#fdf1e7}
.contact-form-card{border-color:#ead8ca;box-shadow:0 20px 50px rgba(83,44,20,.09)}
.contact-form-card input,.contact-form-card select,.contact-form-card textarea{border-color:#e5d8cf;color:#3a2417}
.contact-form-card input:focus,.contact-form-card select:focus,.contact-form-card textarea:focus{border-color:var(--primary-light);box-shadow:0 0 0 4px rgba(156,79,37,.12)}
.human-check input{accent-color:var(--primary)}
.contact-submit{background:linear-gradient(135deg,var(--primary),var(--primary-light));box-shadow:0 12px 24px rgba(156,79,37,.22)}
.contact-submit:hover{background:#833f1d}.contact-footer{background:#3a2417;color:#e7d8cb}

/* StepLedger */
.sl-hero{background:radial-gradient(circle at 88% 12%,#f2d8c3 0,transparent 27%),linear-gradient(125deg,#fdf6f0 0%,#fffaf6 48%,#f9eee5 100%)}
.sl-hero:after{border-color:#e7c8ae}.sl-dashboard{background:#f5e8dd;box-shadow:0 28px 60px rgba(83,44,20,.2)}
.dash-brand{color:var(--primary)}.dash-brand b{color:#3a2417}.avatar{background:#f5e0cf;color:var(--primary)}
.dash-nav.active{background:#f8e6d7;color:var(--primary)}.status.delivery{color:#a45120;background:#f9e7da}
.sl-workflow{background:#3a2417}.steps:before{background:#805a43}.step-no{border-color:#3a2417;background:#7a4529}.step:nth-child(2) .step-no{background:#9c4f25}.step:nth-child(3) .step-no{background:#16805e}.step:nth-child(4) .step-no{background:#c67a44}
.sl-icon{background:#f8e8da;color:var(--primary)}.bar{background:#e7c2a7}.bar:nth-child(2),.bar:nth-child(5){background:var(--primary)}.sl-cta{background:linear-gradient(135deg,#f8e6d8,#fffaf6)}.sl-footer{background:#3a2417;color:#e7d8cb}

/* Shared service and product surfaces */
.services-hero,.product-hero{background:linear-gradient(135deg,#fbf0e7,#fff)}
.tech-item{background:#fdf3eb}
