/* ============================================================
   DELPH'S HOLDING — Shared Styles
   Palette: Bleu cobalt #1565C0 (Delph's) + Cyan #29ABE2 (CAMEROON)
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500&family=DM+Sans:opsz,wght@9..40,300;9..40,400;9..40,500&display=swap');

/* ── VARIABLES ── */
:root {
    /* Backgrounds */
    --bg:        #F5F8FC;
    --bg-2:      #EBF0F8;
    --bg-card:   #FFFFFF;

    /* Text — deep navy */
    --ink:       #0B1E3D;
    --ink-60:    rgba(11,30,61,.76);
    --ink-30:    rgba(11,30,61,.42);
    --ink-10:    rgba(11,30,61,.1);

    /* Brand — Delph's cobalt blue */
    --gold:      #1565C0;
    --gold-rich: #29ABE2;
    --gold-dim:  rgba(21,101,192,.09);
    --gold-pale: rgba(21,101,192,.04);

    /* Borders — blue-tinted */
    --border:    rgba(21,101,192,.20);
    --border-f:  rgba(21,101,192,.09);

    /* Dark sections */
    --navy:      #0D2147;

    /* Shadows */
    --shadow:    0 4px 40px rgba(11,30,61,.08);
    --shadow-md: 0 8px 60px rgba(11,30,61,.12);

    /* Fonts */
    --ff-d: 'Cormorant Garamond', Georgia, serif;
    --ff-b: 'DM Sans', sans-serif;
    --ease: cubic-bezier(.25,.46,.45,.94);
    --ease-out: cubic-bezier(0,.55,.45,1);
}

/* ── RESET ── */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior: smooth; font-size: 16px; }
body {
    background: var(--bg);
    color: var(--ink);
    font-family: var(--ff-b);
    font-weight: 300;
    line-height: 1.65;
    overflow-x: hidden;
    cursor: none;
}

/* ── GRAIN ── */
body::after {
    content: '';
    position: fixed; inset: 0;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E");
    opacity: .022;
    pointer-events: none;
    z-index: 9000;
}

/* ── CURSOR ── */
.cursor, .cursor-ring {
    position: fixed; pointer-events: none; border-radius: 50%;
    transform: translate(-50%,-50%); transition: opacity .3s;
}
.cursor { width:7px; height:7px; background:var(--gold); z-index:9501; }
.cursor-ring {
    width:32px; height:32px;
    border:1px solid rgba(21,101,192,.4);
    z-index:9500;
    transition: width .3s var(--ease), height .3s var(--ease), border-color .3s;
}
body.hov .cursor-ring { width:48px; height:48px; border-color:var(--gold); }
@media (hover:none) { body { cursor:auto; } .cursor,.cursor-ring { display:none; } }

/* ── LAYOUT ── */
.wrap { max-width:1400px; margin:0 auto; padding:0 4rem; }

/* ── SHARED COMPONENTS ── */
.lbl { display:inline-flex; align-items:center; gap:.85rem; margin-bottom:1.25rem; }
.lbl-line { width:26px; height:1px; background:var(--gold); }
.lbl-text { font-size:.62rem; letter-spacing:.35em; text-transform:uppercase; color:var(--gold); }

.section-h2 {
    font-family: var(--ff-d);
    font-size: clamp(2.2rem, 4vw, 4rem);
    font-weight: 400; line-height: 1.08; color: var(--ink);
}
.section-h2 em {
    font-style: italic;
    background: linear-gradient(135deg, var(--gold) 0%, var(--gold-rich) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.eyebrow { display:inline-flex; align-items:center; gap:.9rem; margin-bottom:2rem; }
.ey-line { width:34px; height:1px; background:var(--gold); flex-shrink:0; }
.ey-text { font-size:.62rem; letter-spacing:.34em; text-transform:uppercase; color:var(--gold); }

/* ── BUTTONS ── */
.btn {
    display: inline-flex; align-items: center; gap: .7rem;
    font-family: var(--ff-b); font-size: .7rem; font-weight: 500;
    letter-spacing: .2em; text-transform: uppercase;
    text-decoration: none; cursor: pointer;
    border: none; outline: none; transition: .35s var(--ease);
}

/* Primary — brand blue */
.btn-dark {
    background: var(--gold); /* = #1565C0 */
    color: #fff;
    padding: 1rem 2rem;
    position: relative; overflow: hidden;
}
.btn-dark::before {
    content: '';
    position: absolute; top:0; left:-100%;
    width:100%; height:100%;
    background: var(--gold-rich); /* = #29ABE2 */
    transition: left .4s var(--ease);
}
.btn-dark:hover::before { left:0; }
.btn-dark > * { position:relative; z-index:1; }

/* Outline */
.btn-outline {
    background: transparent; color: var(--ink-60);
    border: 1px solid var(--border);
    padding: .95rem 1.8rem;
}
.btn-outline:hover { border-color:var(--gold); color:var(--gold); }

/* Navy (truly dark) */
.btn-navy {
    background: var(--navy); color: #fff;
    padding: 1rem 2rem; position: relative; overflow: hidden;
}
.btn-navy::before {
    content: ''; position: absolute; top:0; left:-100%;
    width:100%; height:100%; background: var(--gold);
    transition: left .4s var(--ease);
}
.btn-navy:hover::before { left:0; }
.btn-navy > * { position:relative; z-index:1; }

/* Gold (cyan) */
.btn-gold {
    background: var(--gold-rich); color: #fff;
    padding: 1rem 2rem; position: relative; overflow: hidden;
}
.btn-gold::before {
    content: ''; position: absolute; top:0; left:-100%;
    width:100%; height:100%; background: var(--gold);
    transition: left .4s var(--ease);
}
.btn-gold:hover::before { left:0; }
.btn-gold > * { position:relative; z-index:1; }

.arrow {
    display: inline-flex; align-items: center;
    width:18px; height:1px; background: currentColor;
    position: relative; transition: width .3s; flex-shrink: 0;
}
.arrow::after {
    content:''; position:absolute; right:0; top:-3px;
    width:6px; height:6px;
    border-top:1px solid currentColor; border-right:1px solid currentColor;
    transform:rotate(45deg);
}
.btn-dark:hover .arrow,
.btn-outline:hover .arrow,
.btn-gold:hover .arrow,
.btn-navy:hover .arrow { width:26px; }

/* ── NAV ── */
nav.main-nav {
    position: fixed; inset: 0 0 auto 0; z-index: 800;
    display: flex; align-items: center; justify-content: space-between;
    padding: 1rem 4rem;
    transition: padding .4s var(--ease), background .4s, box-shadow .4s, border-color .4s, backdrop-filter .4s;
    border-top: 2px solid var(--gold-rich);
    border-bottom: 1px solid rgba(255,255,255,.15);
    background: rgba(255,255,255,.72);
    backdrop-filter: blur(16px) saturate(160%);
    -webkit-backdrop-filter: blur(16px) saturate(160%);
}
nav.main-nav.scrolled {
    padding: .7rem 4rem;
    background: rgba(255,255,255,.95);
    backdrop-filter: blur(24px) saturate(200%);
    -webkit-backdrop-filter: blur(24px) saturate(200%);
    border-color: rgba(21,101,192,.12);
    box-shadow: 0 2px 40px rgba(11,30,61,.08);
}

/* Logo anchor + image */
a.logo { display: flex; align-items: center; text-decoration: none; flex-shrink: 0; }
.nav-logo-img {
    height: 92px; width: auto; display: block;
    transition: opacity .3s;
}
.nav-logo-img:hover { opacity: .82; }

.nav-links { display:flex; align-items:center; gap:2.5rem; list-style:none; }
.nav-links a {
    font-size:.88rem; letter-spacing:.12em; text-transform:uppercase;
    color:var(--ink-60); text-decoration:none; position:relative;
    transition:color .3s;
}
.nav-links a::after {
    content:''; position:absolute; bottom:-3px; left:0;
    width:0; height:1px; background:var(--gold);
    transition:width .35s var(--ease);
}
.nav-links a:hover, .nav-links a.active { color:var(--gold); }
.nav-links a:hover::after, .nav-links a.active::after { width:100%; }

.nav-cta {
    background: var(--gold) !important;
    color: #fff !important;
    padding:.6rem 1.4rem; font-weight:500;
    transition: background .3s !important;
}
.nav-cta:hover { background: var(--gold-rich) !important; color:#fff !important; }
.nav-cta::after { display:none !important; }

.burger { display:none; flex-direction:column; gap:5px; cursor:pointer; padding:4px; z-index:850; }
.burger span { display:block; width:22px; height:1px; background:var(--ink); transition:transform .4s var(--ease), opacity .3s; }
.burger.open span { background:var(--gold); }
.burger.open span:nth-child(1) { transform:translateY(6px) rotate(45deg); }
.burger.open span:nth-child(2) { opacity:0; }
.burger.open span:nth-child(3) { transform:translateY(-6px) rotate(-45deg); }

/* ── MOBILE NAV ── */
.mob-nav {
    position:fixed; inset:0; background:var(--bg); z-index:820;
    display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2.5rem;
    transform:translateX(100%);
    transition:transform .55s cubic-bezier(.77,0,.18,1);
}
.mob-nav.open { transform:translateX(0); }
.mob-nav a {
    font-family:var(--ff-d); font-size:2.4rem; font-weight:300;
    letter-spacing:.08em; color:var(--ink); text-decoration:none; transition:color .3s;
}
.mob-nav a:hover { color:var(--gold); }

/* ── PAGE HERO (inner pages) ── */
.page-hero {
    padding: 12rem 0 7rem;
    background: linear-gradient(160deg, #FFFFFF 0%, #EDF3FB 100%);
    border-bottom: 1px solid var(--border-f);
    position: relative; overflow: hidden;
}
.page-hero::after {
    content: '';
    position: absolute; bottom: 0; left: 4rem;
    width: 100px; height: 2px;
    background: linear-gradient(to right, var(--gold), var(--gold-rich));
    z-index: 3;
}
.page-hero > .wrap {
    position: relative;
    z-index: 2;
}
.page-hero-bg {
    position: absolute; inset: 0;
    width: 100%; height: 100%;
    object-fit: cover;
    object-position: center;
    opacity: 0.13;
    z-index: 0;
}
.page-hero-grid {
    position:absolute; inset:0;
    background-image:
        linear-gradient(to right, rgba(21,101,192,.1) 1px, transparent 1px),
        linear-gradient(to bottom, rgba(21,101,192,.1) 1px, transparent 1px);
    background-size:70px 70px;
    mask-image:radial-gradient(ellipse 80% 80% at 20% 50%, black 20%, transparent 100%);
}
.breadcrumb {
    display:flex; align-items:center; gap:.75rem;
    font-size:.65rem; letter-spacing:.22em; text-transform:uppercase;
    color:var(--ink-30); margin-bottom:2rem;
}
.breadcrumb a { color:var(--gold); text-decoration:none; transition:opacity .3s; }
.breadcrumb a:hover { opacity:.7; }
.breadcrumb-sep { color:var(--border); }
.page-hero-title {
    font-family:var(--ff-d);
    font-size:clamp(3rem,7vw,7rem); font-weight:300; line-height:1.0; color:var(--ink);
}
.page-hero-title em {
    font-style: italic;
    background: linear-gradient(135deg, var(--gold) 0%, var(--gold-rich) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}
.page-hero-sub {
    font-size:.95rem; color:var(--ink-60);
    max-width:540px; line-height:1.85; margin-top:1.5rem;
}

/* ── STATS STRIP ── */
.stats-strip { background: linear-gradient(160deg, #060f25 0%, var(--navy) 50%, #0b1f47 100%); }
.stats-row { display:grid; grid-template-columns:repeat(5,1fr); }
.stat {
    padding:2.25rem 2.5rem;
    border-right:1px solid rgba(255,255,255,.08);
    position:relative;
}
.stat:last-child { border-right:none; }
.stat::before {
    content:''; position:absolute; top:0; left:2.5rem;
    width:18px; height:2px; background:var(--gold-rich);
}
.stat-n {
    font-family:var(--ff-d); font-size:3.4rem; font-weight:600;
    line-height:1; margin-bottom:.4rem; color:#fff;
}
.stat-n sup { color:var(--gold-rich); font-size:2rem; }
.stat-l { font-size:.63rem; letter-spacing:.14em; text-transform:uppercase; color:rgba(255,255,255,.35); line-height:1.55; }

/* ── CTA BAND ── */
.cta-band { background: linear-gradient(135deg, var(--gold) 0%, var(--gold-rich) 100%); padding:6rem 0; text-align:center; position: relative; overflow: hidden; }
.cta-band::before {
    content: '';
    position: absolute; inset: 0;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='60'%3E%3Cpath d='M0 60L60 0' stroke='rgba(255,255,255,.05)' stroke-width='1'/%3E%3C/svg%3E");
    background-size: 60px 60px;
    pointer-events: none;
}
.cta-band h2 { font-family:var(--ff-d); font-size:clamp(2rem,4vw,3rem); font-weight:300; color:#fff; margin-bottom:1.5rem; }
.cta-band h2 em { font-style:italic; }
.cta-band p { color:rgba(255,255,255,.75); font-size:.9rem; margin-bottom:2.5rem; line-height:1.8; }

/* ── FOOTER ── */
footer.main-footer {
    background: var(--navy);
    padding: 5rem 0 2.5rem;
    border-top: 2px solid transparent;
    background-image: linear-gradient(var(--navy), var(--navy)),
                      linear-gradient(to right, var(--gold), var(--gold-rich));
    background-origin: padding-box, border-box;
    background-clip: padding-box, border-box;
}
.ft-top {
    display:grid; grid-template-columns:2fr 1fr 1fr 1fr;
    gap:4rem; padding-bottom:4rem;
    border-bottom:1px solid rgba(255,255,255,.07);
}
.footer-logo-img { height:130px; width:auto; display:block; margin-bottom:1.5rem; }
.f-tagline { font-size:.56rem; letter-spacing:.38em; text-transform:uppercase; color:var(--gold-rich); margin-bottom:1.5rem; }
.f-desc { font-size:.78rem; line-height:1.85; max-width:260px; color:rgba(255,255,255,.3); }
.fc-title { font-size:.56rem; letter-spacing:.32em; text-transform:uppercase; color:var(--gold-rich); margin-bottom:1.5rem; }
.f-lnks { list-style:none; display:flex; flex-direction:column; gap:.7rem; }
.f-lnks a { font-size:.78rem; color:rgba(255,255,255,.3); text-decoration:none; transition:color .3s; }
.f-lnks a:hover { color:var(--gold-rich); }
.ft-bot {
    display:flex; justify-content:space-between; align-items:center;
    padding-top:2.5rem; gap:1rem;
}
.f-copy { font-size:.68rem; color:rgba(255,255,255,.2); }
.f-socials { display:flex; gap:.75rem; }
.f-soc {
    width:30px; height:30px;
    border:1px solid rgba(255,255,255,.12);
    display:flex; align-items:center; justify-content:center;
    text-decoration:none; transition:border-color .3s, background .3s;
}
.f-soc:hover { border-color:var(--gold-rich); background:rgba(41,171,226,.15); }
.f-soc svg { width:11px; height:11px; stroke:var(--gold-rich); fill:none; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }

/* ── SECTION PHOTOS ── */
.section-photo {
    width: 100%;
    height: 300px;
    object-fit: cover;
    display: block;
    margin-bottom: 2.5rem;
}
.svc-hl-img {
    width: calc(100% + 6rem);
    height: 210px;
    object-fit: cover;
    display: block;
    margin: -3rem -3rem 2.5rem;
}
.s-card-img {
    width: calc(100% + 6rem);
    height: 160px;
    object-fit: cover;
    display: block;
    margin: -3rem -3rem 2rem;
}

/* ── REVEAL ── */
.reveal { opacity:0; transform:translateY(26px); transition:opacity .8s var(--ease), transform .8s var(--ease); }
.reveal.in { opacity:1; transform:translateY(0); }
.d1{transition-delay:.1s} .d2{transition-delay:.2s} .d3{transition-delay:.3s}
.d4{transition-delay:.4s} .d5{transition-delay:.5s} .d6{transition-delay:.6s}

/* ── KEYFRAMES ── */
@keyframes fadeUp { to { opacity:1; transform:translateY(0); } }
@keyframes slideUp { to { opacity:1; transform:translateY(0); } }
@keyframes pulse { 0%,100%{opacity:1} 50%{opacity:.25} }
@keyframes ticker-scroll {
    from { transform:translateX(0); }
    to   { transform:translateX(-50%); }
}

/* ── RESPONSIVE ── */
@media (max-width:1100px) {
    nav.main-nav, nav.main-nav.scrolled { padding-left:2rem; padding-right:2rem; }
    .wrap { padding:0 2rem; }
    .nav-links { display:none; }
    .burger { display:flex; }
    .ft-top { grid-template-columns:1fr 1fr; gap:3rem; }
    .stats-row { grid-template-columns:repeat(3,1fr); }
    .stat:nth-child(3) { border-right:none; }
}
@media (max-width:768px) {
    .wrap { padding:0 1.5rem; }
    .ft-top { grid-template-columns:1fr; gap:2rem; }
    .ft-bot { flex-direction:column; text-align:center; }
    .stats-row { grid-template-columns:1fr 1fr; }
    .stat:nth-child(3) { border-right:1px solid rgba(255,255,255,.08); }
    .stat:nth-child(2),.stat:nth-child(4) { border-right:none; }
    .page-hero { padding:9rem 0 4rem; }
    nav.main-nav .nav-logo-img { height: 74px; }
}
@media (max-width:480px) {
    .stats-row { grid-template-columns:1fr; }
    .stat { border-right:none; border-bottom:1px solid rgba(255,255,255,.08); }
    .stat:last-child { border-bottom:none; }
    nav.main-nav .nav-logo-img { height: 62px; }
}