/* ============================================================
   Shetaban Shomal — Public Site Design System (site-light)
   Brand: deep navy #233368 + signal yellow #FDD302 · no gradients
   Same token family as panel ds-light.css
   ============================================================ */

:root {
    /* canvas & surfaces */
    --canvas: #F5F7FB;
    --surface: #FFFFFF;
    --surface-soft: #F6F8FC;
    --line: #E3E8F2;
    --line-strong: #C9D4EA;

    /* ink */
    --ink-900: #1B2338;
    --ink-700: #30384A;
    --ink-600: #4D5567;
    --ink-500: #687187;   /* 4.88:1 on white · 4.55:1 on canvas */
    --ink-300: #9AA6BF;

    /* accent (brand navy, solid only) */
    --brand-50: #F2F5FB;
    --brand-100: #E6EBF6;
    --brand-200: #C9D4EA;
    --brand-300: #9BB0D6;
    --brand-400: #5E7BB4;
    --brand-500: #233368;
    --brand-600: #1D2B58;
    --brand-700: #182448;
    --brand-800: #131D3A;
    --brand-900: #101C3F;

    /* signal yellow — decorative on navy; the -text variants are AA-safe on light */
    --gold: #FDD302;
    --accent-300: #FDD302;
    --accent-400: #A97E00;   /* icons / graphics on white: 3.7:1 */
    --accent-500: #8A6600;   /* small text on white: 5.3:1 */

    /* semantic */
    --amber: #B97E14;
    --amber-tint: #FBF3E2;
    --green: #2F8F5B;
    --green-tint: #E9F5EE;
    --red: #C2493D;
    --red-tint: #FBEEEC;

    --shadow-sm: 0 2px 6px rgba(27,35,56,.05);
    --shadow-md: 0 10px 30px rgba(27,35,56,.07), 0 2px 6px rgba(27,35,56,.04);
    --shadow-lg: 0 18px 44px rgba(27,35,56,.12), 0 4px 10px rgba(27,35,56,.05);
    --shadow-pop: 0 24px 60px rgba(16,28,63,.18);
    --radius: 20px;
    --radius-md: 16px;
    --radius-sm: 12px;
    --pill: 999px;
    --section-space: clamp(56px, 7vw, 88px);
    --gutter: clamp(18px, 3vw, 30px);
}

/* Public pages share the ds-* form/card primitives from the panel sheet;
   re-scope their accent tokens so the site and the panel speak one brand. */
:root {
    --ds-teal: #233368;
    --ds-teal-dark: #182448;
    --ds-teal-ink: #101C3F;
    --ds-teal-tint: #E6EBF6;
    --ds-teal-tint-2: #F2F5FB;
}

* { font-family: "Vazirmatn", system-ui, -apple-system, "Segoe UI", sans-serif; }

body {
    background: var(--canvas);
    color: var(--ink-700);
    font-size: 15px;
    line-height: 1.75;
    -webkit-font-smoothing: antialiased;
}
h1,h2,h3,h4,h5,h6 { color: var(--ink-900); font-weight: 800; line-height: 1.35; letter-spacing: -.01em; }
a { text-decoration: none; color: var(--brand-500); }
a:hover { color: var(--brand-700); }
::selection { background: var(--brand-100); color: var(--brand-900); }

/* ---------- Utility mirror (Tailwind-ish classes used by views) ---------- */
.block{display:block}.inline-block{display:inline-block}.hidden{display:none}
.flex{display:flex}.inline-flex{display:inline-flex}.flex-wrap{flex-wrap:wrap}
.flex-col{flex-direction:column}.flex-grow-1{flex-grow:1}.flex-1{flex:1 1 0%}
.grid{display:grid}.relative{position:relative}.absolute{position:absolute}
.inset-0{top:0;right:0;bottom:0;left:0}.text-center{text-align:center}
.text-right{text-align:right}.text-left{text-align:left}
.items-center{align-items:center}.items-start{align-items:flex-start}
.items-end{align-items:flex-end}
.justify-center{justify-content:center}.justify-between{justify-content:space-between}
.justify-end{justify-content:flex-end}
.gap-1{gap:.25rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.gap-5{gap:1.25rem}
.gap-6{gap:1.5rem}.gap-8{gap:2rem}.gap-10{gap:2.5rem}.gap-12{gap:3rem}
.space-y-2 > * + *{margin-top:.5rem}
.space-y-4 > * + *{margin-top:1rem}
.space-y-6 > * + *{margin-top:1.5rem}
.space-y-8 > * + *{margin-top:2rem}
.w-full{width:100%}.max-w-full{max-width:100%}.object-contain{object-fit:contain}
.p-2{padding:.5rem}.p-3{padding:.75rem}.p-4{padding:1rem}.p-5{padding:1.25rem}
.p-6{padding:1.5rem}.p-8{padding:2rem}
.px-4{padding-left:1rem;padding-right:1rem}
.py-2{padding-top:.5rem;padding-bottom:.5rem}
.py-2\.5{padding-top:.625rem;padding-bottom:.625rem}
.py-3{padding-top:.75rem;padding-bottom:.75rem}
.py-6{padding-top:1.5rem;padding-bottom:1.5rem}
.py-16{padding-top:4rem;padding-bottom:4rem}
.mt-1{margin-top:.25rem}.mt-2{margin-top:.5rem}.mt-3{margin-top:.75rem}
.mt-4{margin-top:1rem}.mt-6{margin-top:1.5rem}.mt-8{margin-top:2rem}
.mt-10{margin-top:2.5rem}.mb-1{margin-bottom:.25rem}.mb-2{margin-bottom:.5rem}.mb-3{margin-bottom:.75rem}
.mb-4{margin-bottom:1rem}.mb-6{margin-bottom:1.5rem}.mb-10{margin-bottom:2.5rem}
.mx-auto{margin-left:auto;margin-right:auto}
.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}
.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.max-w-3xl{max-width:48rem}.max-w-4xl{max-width:56rem}
.max-w-6xl{max-width:72rem}.max-w-7xl{max-width:80rem}
.text-xs{font-size:.75rem}.text-sm{font-size:.875rem}.text-base{font-size:1rem}
.text-lg{font-size:1.125rem}.text-xl{font-size:1.25rem}
.text-2xl{font-size:1.5rem}.text-3xl{font-size:1.875rem}.text-4xl{font-size:2.25rem}
.font-medium{font-weight:500}.font-semibold{font-weight:600}.font-bold{font-weight:700}
.font-extrabold{font-weight:800}
.fw-extrabold{font-weight:800}
.leading-relaxed{line-height:1.7}.leading-loose{line-height:2.1}
.rounded-lg{border-radius:12px}.rounded-xl{border-radius:16px}
.rounded-2xl{border-radius:20px}.rounded-full{border-radius:9999px}
.border{border:1px solid var(--line)}.overflow-hidden{overflow:hidden}
.shadow-sm{box-shadow:var(--shadow-sm)}.shadow-md{box-shadow:var(--shadow-md)}
.shadow-lg{box-shadow:var(--shadow-lg)}
.transition-all{transition:all .2s ease}
.transition-colors{transition:color .15s,background-color .15s,border-color .15s}
.hover\:translate-y-1:hover{transform:translateY(-.25rem)}
.bg-white{background:var(--surface)}
.bg-slate-50{background:var(--surface-soft)}
.bg-slate-100{background:var(--canvas)}
.text-white{color:#fff}
.text-slate-300{color:#B6BDC6}
.text-slate-400{color:var(--ink-500)}   /* was --ink-300 (#9AA3AF, 2.6:1) — raised to AA */
.text-slate-500{color:var(--ink-500)}
.text-slate-600{color:var(--ink-600)}
.text-slate-700{color:var(--ink-700)}
.text-slate-900{color:var(--ink-900)}
.bg-brand-50{background:var(--brand-50)}
.bg-brand-100{background:var(--brand-100)}
.bg-brand-500{background:var(--brand-500)}
.bg-brand-600{background:var(--brand-500)}
.bg-brand-700{background:var(--brand-700)}
.bg-brand-800{background:var(--brand-800)}
.bg-brand-900{background:var(--brand-900)}
.text-brand-100{color:var(--brand-100)}.text-brand-200{color:var(--brand-200)}
.text-brand-300{color:var(--brand-300)}.text-brand-400{color:var(--brand-400)}
.text-brand-500{color:var(--brand-500)}.text-brand-600{color:var(--brand-500)}
.text-brand-700{color:var(--brand-700)}
.hover\:bg-brand-700:hover{background:var(--brand-700)}
.hover\:text-brand-700:hover{color:var(--brand-700)}
.hover\:text-white:hover{color:#fff}
.border-slate-100{border-color:var(--line)}
.border-slate-200{border-color:var(--line-strong)}

@media (min-width:640px){
    .sm\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
    .sm\:flex-row{flex-direction:row}
}
@media (min-width:768px){
    .md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
    .md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
    .md\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
    .md\:p-8{padding:2rem}.md\:p-10{padding:2.5rem}
    .md\:text-4xl{font-size:2.25rem}
}
@media (min-width:1024px){
    .lg\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
    .lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
    .lg\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
}

/* ============================================================
   Buttons (pill, solid)
   ============================================================ */
.btn-brand {
    display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
    padding:.72rem 1.6rem;border-radius:var(--pill);font-weight:700;color:#fff;
    background:var(--brand-500);border:none;
    box-shadow:0 6px 18px rgba(35,51,104,.26);transition:all .18s ease;
    font-size:.94rem;
}
.btn-brand:hover{background:var(--brand-700);color:#fff;transform:translateY(-1px);box-shadow:0 10px 24px rgba(35,51,104,.30);}
.btn-brand-outline {
    display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
    padding:.68rem 1.4rem;border-radius:var(--pill);font-weight:700;color:var(--brand-700);
    background:var(--surface);border:1.5px solid var(--brand-200);transition:all .18s ease;
    font-size:.92rem;
}
.btn-brand-outline:hover{background:var(--brand-50);color:var(--brand-800);border-color:var(--brand-300);}
.btn-ghost {
    display:inline-flex;align-items:center;gap:.5rem;color:var(--ink-700);
    font-weight:600;padding:.55rem 1rem;border-radius:var(--pill);transition:all .15s;
}
.btn-ghost:hover{background:var(--surface-soft);color:var(--brand-700);}

/* ============================================================
   Cards / Sections
   ============================================================ */
.card-shadow, .card-glass {
    background:var(--surface);border-radius:var(--radius);
    box-shadow:var(--shadow-md);border:1px solid var(--line);
    transition:all .25s ease;
}
.card-glass:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:var(--brand-200);}

/* Section labels read as plain text - review note: headings must not look like buttons. */
.section-eyebrow{
    display:inline-block;
    font-size:.85rem;font-weight:700;letter-spacing:.02em;
    color:var(--brand-700);background:none;border:none;
    padding:0;margin-bottom:.6rem;
}
.section-title{font-size:clamp(1.4rem, 3vw, 2rem);font-weight:800;color:var(--ink-900);margin-bottom:.5rem;}
/* --ink-600 (#475569) on canvas #F4F2ED = 6.8:1 — --ink-500 was 4.32:1 (below AA at 15px) */
.section-subtitle{color:var(--ink-600);max-width:42rem;margin:0 auto;line-height:1.9;}

.feature-icon{
    width:56px;height:56px;border-radius:16px;display:flex;align-items:center;justify-content:center;
    font-size:1.35rem;color:var(--brand-700);margin-bottom:1rem;
    background:var(--brand-100);border:1px solid var(--brand-200);
}

/* ============================================================
   HEADER / NAV
   ============================================================ */
.site-header{
    position:sticky;top:0;z-index:1040;background:var(--surface);
    border-bottom:1px solid var(--line);
    box-shadow:0 1px 2px rgba(31,41,51,.04);
}
.site-header .nav-inner{
    max-width:1200px;margin:0 auto;padding:.75rem 1rem;
    display:flex;align-items:center;justify-content:space-between;gap:1rem;
}
.brand-logo{display:flex;align-items:center;gap:.65rem;font-weight:800;font-size:1.15rem;color:var(--ink-900);}
.brand-logo img{height:44px;width:auto;object-fit:contain;background:var(--surface);border-radius:10px;padding:2px 6px;border:1px solid var(--line);}
.brand-logo .logo-badge{
    width:40px;height:40px;border-radius:12px;display:flex;align-items:center;justify-content:center;
    color:var(--brand-700);font-size:1.1rem;background:var(--brand-100);border:1px solid var(--brand-200);
}
.brand-logo .logo-text small{display:block;font-size:.68rem;font-weight:500;color:var(--ink-500);line-height:1.2;margin-top:2px;}
.site-nav{display:flex;align-items:center;gap:.25rem;}
.site-nav a{
    padding:.55rem 1rem;border-radius:var(--pill);color:var(--ink-700);font-weight:600;font-size:.92rem;
    transition:all .15s;
}
.site-nav a:hover{background:var(--brand-100);color:var(--brand-700);}
.nav-actions{display:flex;align-items:center;gap:.5rem;}
.nav-toggle{display:none;border:1px solid var(--line);background:var(--surface);color:var(--brand-700);
    width:44px;height:44px;border-radius:12px;font-size:1.15rem;cursor:pointer;}
.nav-toggle:hover{background:var(--brand-100);}
.mobile-nav{display:none;padding:.5rem 1rem 1rem;border-top:1px solid var(--line);background:var(--surface);}
.mobile-nav.show{display:block;}
.mobile-nav a{display:block;padding:.7rem .9rem;border-radius:12px;color:var(--ink-700);font-weight:600;}
.mobile-nav a:hover{background:var(--brand-100);color:var(--brand-700);}
@media (max-width:991.98px){
    .site-nav,.nav-actions .hide-sm{display:none;}
    .nav-toggle{display:flex;align-items:center;justify-content:center;}
}

/* ============================================================
   HERO — light canvas, teal accent typography, floating cards
   ============================================================ */
.hero{
    position:relative;overflow:hidden;
    background:var(--canvas);
    color:var(--ink-900);
    padding:5rem 0 5.5rem;
    border-bottom:1px solid var(--line);
}
.hero .container{position:relative;z-index:1;}
.hero h1{color:var(--ink-900);font-size:clamp(1.9rem,5vw,3rem);font-weight:800;line-height:1.35;}
.hero h1 .accent{color:var(--brand-500);}
.hero .lead{color:var(--ink-600);font-size:1.05rem;max-width:38rem;line-height:2;}
.hero-search{background:var(--surface);border-radius:var(--radius);padding:1rem;box-shadow:var(--shadow-lg);display:flex;gap:.75rem;flex-wrap:wrap;border:1px solid var(--line);}
.hero-pill{display:inline-flex;align-items:center;gap:.4rem;background:var(--brand-100);
    border:1px solid var(--brand-200);color:var(--brand-800);padding:.45rem 1rem;border-radius:var(--pill);font-size:.85rem;font-weight:700;}
.hero-float-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);
    box-shadow:var(--shadow-md);padding:14px 18px;display:inline-flex;align-items:center;gap:12px;}

/* ============================================================
   HERO SLIDER — full-bleed photographic slides, uniform layout
   ============================================================ */
.hero-slider-band{position:relative;background:var(--brand-900);}
.hero-slider-band .carousel,.hero-slider-band .carousel-inner{height:100%;}

.hs-slide{position:relative;display:flex;align-items:center;
    min-height:clamp(480px,74vh,660px);background-color:var(--brand-900);
    background-position:center;background-size:cover;background-repeat:no-repeat;}
.hs-scrim{position:absolute;inset:0;z-index:1;background:rgba(16,28,63,.66);}
.hs-inner{position:relative;z-index:2;width:100%;padding:clamp(3.75rem,7vw,5.5rem) 0;}
.hs-content{max-width:38rem;color:#fff;}

.hs-kicker{display:inline-flex;align-items:center;gap:.5rem;font-size:.82rem;font-weight:700;
    color:var(--gold);background:rgba(16,28,63,.5);border:1px solid rgba(255,255,255,.24);
    padding:.42rem 1.05rem;border-radius:var(--pill);margin-bottom:1.2rem;}
.hs-content h1,.hs-content h2{color:#fff;margin:0 0 1rem;font-weight:800;line-height:1.42;
    font-size:clamp(1.7rem,4.4vw,3rem);}
.hs-content h1 .gold,.hs-content h2 .gold{color:var(--gold);}
.hs-rule{display:block;width:78px;height:3px;border-radius:var(--pill);background:var(--gold);margin:0 0 1.35rem;}
.hs-content p{color:rgba(255,255,255,.9);font-size:1.04rem;line-height:2.1;max-width:34rem;margin:0 0 1.85rem;}
.hs-actions{display:flex;flex-wrap:wrap;gap:.85rem;}
.hs-facts{display:flex;flex-wrap:wrap;gap:1.4rem;margin-top:1.9rem;font-size:.86rem;color:rgba(255,255,255,.9);}
.hs-facts i{color:var(--gold);margin-inline-end:.35rem;}

/* indicators — slim progress bars, centered */
.hs-dots{position:absolute;z-index:4;bottom:1.7rem;inset-inline:0;margin:0;
    display:flex;justify-content:center;gap:.5rem;}
.hs-dots [data-bs-target]{box-sizing:content-box;width:26px;height:4px;margin:0;padding:0;
    text-indent:-999px;border:0;border-radius:var(--pill);background:rgba(255,255,255,.42);opacity:1;
    transition:width .28s ease,background-color .28s ease;}
.hs-dots [data-bs-target].active{width:46px;background:var(--gold);}

/* prev / next — circular, vertically centered on the edges */
.hs-arrow{position:absolute;z-index:4;top:50%;transform:translateY(-50%);
    width:50px;height:50px;display:inline-flex;align-items:center;justify-content:center;
    border-radius:var(--pill);border:1px solid rgba(255,255,255,.35);background:rgba(16,28,63,.32);
    color:#fff;font-size:1.05rem;cursor:pointer;transition:background-color .18s,border-color .18s,color .18s;}
.hs-arrow:hover{background:var(--gold);border-color:var(--gold);color:var(--brand-900);}
.hs-arrow:focus-visible{outline:3px solid var(--gold);outline-offset:2px;}
.hs-arrow--prev{inset-inline-start:clamp(1rem,3vw,2.5rem);}
.hs-arrow--next{inset-inline-end:clamp(1rem,3vw,2.5rem);}

/* stat card straddles the boundary between the dark hero and the light page */
.hero-stats{position:relative;z-index:6;margin-top:-58px;}


/* ============================================================
   FOOTER — light, warm canvas, teal brand band
   ============================================================ */
.site-footer{
    background:var(--surface);
    color:var(--ink-600);
    padding:3.5rem 0 1.5rem;
    border-top:1px solid var(--line);
}
.site-footer h4{color:var(--ink-900);font-size:1rem;font-weight:800;margin-bottom:1rem;}
.site-footer a{color:var(--ink-600);transition:color .15s;}
.site-footer a:hover{color:var(--brand-700);}
.footer-brand{display:flex;align-items:center;gap:.6rem;color:var(--ink-900);font-weight:800;font-size:1.1rem;margin-bottom:1rem;}
.footer-brand img{height:40px;width:auto;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:3px 8px;}
.footer-social a{
    width:38px;height:38px;border-radius:12px;background:var(--brand-100);
    display:inline-flex;align-items:center;justify-content:center;color:var(--brand-700);transition:all .15s;border:1px solid var(--brand-200);
}
.footer-social a:hover{background:var(--brand-500);color:#fff;transform:translateY(-2px);border-color:var(--brand-500);}
.footer-bottom{border-top:1px dashed var(--line);margin-top:2.5rem;padding-top:1.25rem;
    font-size:.85rem;color:var(--ink-500);display:flex;justify-content:space-between;flex-wrap:wrap;gap:.5rem;}

/* ============================================================
   Page banner (inner pages) — solid teal tint, no gradient
   ============================================================ */
.page-banner{
    background:var(--brand-100);
    color:var(--brand-900);
    padding:3rem 0;
    border-bottom:1px solid var(--brand-200);
    position:relative;
}
.page-banner h1{color:var(--brand-900);font-size:1.9rem;font-weight:800;}
.page-banner .breadcrumb-c{font-size:.85rem;color:var(--brand-800);margin-bottom:.5rem;}
.page-banner .breadcrumb-c a{color:var(--brand-700);}
.page-banner .breadcrumb-c a:hover{color:var(--brand-900);}

/* Stats strip */
.stat-strip{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow-md);
    border:1px solid var(--line);padding:1.5rem;display:flex;gap:1.5rem;flex-wrap:wrap;justify-content:space-around;}
.stat-strip .stat b{display:block;font-size:1.7rem;color:var(--brand-700);font-weight:800;}
.stat-strip .stat span{color:var(--ink-500);font-size:.9rem;}

/* Steps */
.step-card{text-align:center;padding:2rem 1.5rem;background:var(--surface);border-radius:var(--radius);
    border:1px solid var(--line);box-shadow:var(--shadow-sm);position:relative;transition:all .2s;}
.step-card:hover{box-shadow:var(--shadow-md);transform:translateY(-3px);border-color:var(--brand-200);}
.step-num{width:52px;height:52px;border-radius:16px;display:flex;align-items:center;justify-content:center;
    margin:0 auto 1rem;font-weight:800;color:#fff;font-size:1.15rem;
    background:var(--brand-500);}

/* CTA band */
.cta-band{background:var(--brand-800);color:#fff;border-radius:var(--radius);padding:2.75rem 2rem;text-align:center;
    box-shadow:var(--shadow-lg);border:1px solid var(--brand-900);}
.cta-band h2, .cta-band h3 { color:#fff; }
.cta-band p { color: rgba(255,255,255,.85); }
.cta-band .btn-brand { background: #fff; color: var(--brand-800); }
.cta-band .btn-brand:hover { background: var(--brand-100); }

/* login / auth card (used by page_header) */
.auth-card{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow-lg);border:1px solid var(--line);overflow:hidden;}
.auth-aside{background:var(--brand-100);color:var(--brand-900);padding:2.5rem;position:relative;overflow:hidden;border-inline-start:1px solid var(--line);}
.auth-aside h2, .auth-aside h3 { color: var(--brand-900); }

/* dashboard widgets */
.dash-card{background:var(--surface);border-radius:var(--radius);border:1px solid var(--line);
    box-shadow:var(--shadow-sm);padding:1.5rem;height:100%;transition:all .2s;}
.dash-card:hover{box-shadow:var(--shadow-md);transform:translateY(-3px);}
.dash-icon{width:52px;height:52px;border-radius:14px;display:flex;align-items:center;justify-content:center;
    font-size:1.35rem;color:var(--brand-700);background:var(--brand-100);border:1px solid var(--brand-200);}

/* forms */
.form-control, .form-select{border-radius:12px !important;border:1px solid var(--line) !important;
    border-bottom:2px solid var(--line-strong) !important;
    padding:.65rem .9rem !important;font-size:.95rem;background:var(--surface-soft) !important;color:var(--ink-900);}
.form-control:focus,.form-select:focus{border-color:var(--brand-200) !important;
    border-bottom-color:var(--brand-500) !important;background:var(--surface) !important;
    box-shadow:0 0 0 4px rgba(35,51,104,.12) !important;outline:none !important;}
.form-label{font-weight:700;color:var(--ink-700);margin-bottom:.4rem;font-size:.85rem;}

/* imagery */
.img-rounded{border-radius:var(--radius);box-shadow:var(--shadow-md);}

/* empty states */
.mini-stat{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-md);padding:16px 18px;box-shadow:var(--shadow-sm);}
.mini-stat b{display:block;font-size:1.5rem;color:var(--brand-700);font-weight:800;}
.mini-stat span{font-size:.82rem;color:var(--ink-500);}

/* ============================================================
   Bootstrap component overrides (guest ticket / newsletter / contact)
   ============================================================ */
.btn{border-radius:var(--pill);font-weight:700;padding:9px 20px;font-size:.9rem;transition:all .18s ease;}
.btn-sm{padding:5px 14px;font-size:.78rem;}
.btn-lg{padding:12px 28px;font-size:.95rem;}
.btn-primary{background:var(--brand-500);border-color:var(--brand-500);color:#fff;box-shadow:0 6px 16px rgba(35,51,104,.20);}
.btn-primary:hover,.btn-primary:focus,.btn-check:checked+.btn-primary{background:var(--brand-700);border-color:var(--brand-700);color:#fff;}
.btn-outline-primary{color:var(--brand-700);border-color:var(--brand-200);background:var(--surface);}
.btn-outline-primary:hover{background:var(--brand-500);border-color:var(--brand-500);color:#fff;}
.btn-success{background:var(--green);border-color:var(--green);color:#fff;}
.btn-danger{background:var(--red);border-color:var(--red);color:#fff;}
.btn-warning{background:var(--amber);border-color:var(--amber);color:#fff;}
.btn-outline-secondary{color:var(--ink-600);border-color:var(--line-strong);background:var(--surface);}
.btn-outline-secondary:hover{background:var(--surface-soft);color:var(--brand-700);border-color:var(--brand-300);}
.btn-close{filter:none;opacity:.6;}

.badge{border-radius:var(--pill);font-weight:700;padding:.4em .8em;}
.text-bg-light{background:var(--brand-100) !important;color:var(--brand-800) !important;}
.text-bg-success{background:var(--green-tint) !important;color:var(--green) !important;}
.text-bg-danger{background:var(--red-tint) !important;color:var(--red) !important;}
.text-bg-warning{background:var(--amber-tint) !important;color:var(--amber) !important;}

.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-md);}
.alert{border-radius:var(--radius-md);border:1px solid var(--line);}

.table{--bs-table-bg:transparent;}
.table>:not(caption)>*>*{padding:12px 14px;border-bottom-color:#EDF1F8;}
.table thead th{color:var(--ink-500);font-size:.76rem;font-weight:700;}
.table-responsive{border-radius:var(--radius-md);}

.modal-content{border:none;border-radius:var(--radius);box-shadow:var(--shadow-pop,0 24px 60px rgba(31,41,51,.16));overflow:hidden;}
.modal-header{border-bottom-color:var(--line);padding:16px 22px;}
.modal-footer{border-top-color:var(--line);padding:14px 22px;background:var(--surface-soft);}
.modal-backdrop.show{opacity:.45;}
@media (max-width:767.98px){
    .modal-content{border-radius:var(--radius) var(--radius) 0 0;}
    .modal-dialog{margin:0;position:absolute;bottom:0;left:0;right:0;}
}

.swal2-popup{background:var(--surface) !important;border:1px solid var(--line) !important;border-radius:var(--radius) !important;font-family:"Vazirmatn",sans-serif !important;box-shadow:var(--shadow-lg) !important;}
.swal2-confirm.swal2-styled{background:var(--brand-500) !important;border-radius:var(--pill) !important;font-weight:700;}
.swal2-title{color:var(--ink-900) !important;font-weight:800 !important;}
.swal2-html-container{color:var(--ink-600) !important;}

/* ============================================================
   RTL body copy + long LTR tokens
   ============================================================ */
.text-justify{text-align:justify;}
.site-footer li{overflow-wrap:anywhere;}
.site-footer li a{overflow-wrap:anywhere;}

/* ============================================================
   Mobile fine-tuning (<= 575.98px)
   ============================================================ */
@media (max-width:575.98px){
    /* bootstrap g-5 gutters (3rem) push .row outside a narrow .container box */
    .row.g-5{--bs-gutter-x:1.5rem;--bs-gutter-y:1.5rem;}
    /* hero slider: let each slide size to its own content on small screens */
    .hs-slide{min-height:0;}
    .hs-inner{padding:3.5rem 0 4.5rem;}
    .hs-arrow{display:none;}
    .hs-dots{bottom:1.15rem;}
    .hero-stats{margin-top:-40px;}
    .stat-strip{padding:1.15rem;gap:1rem;}
    .stat-strip .stat{flex:1 1 45%;}
}

/* ============================================================
   BRAND PAGE SYSTEM (home + inner public pages)
   navy bands · gold rule · tilt section edges · glass counters
   ============================================================ */
.sh-sec{padding:var(--section-space) 0;position:relative;}
.sh-sec--white{background:var(--surface);}
.sh-sec--soft{background:var(--surface-soft);}
.sh-sec--navy{background:var(--brand-500);color:#fff;}
.sh-sec--navy h2,.sh-sec--navy h3,.sh-sec--navy h4,.sh-sec--navy .h2,.sh-sec--navy .h3{color:#fff;}
.sh-sec--navy p{color:rgba(255,255,255,.86);}

/* gold rule used under every section title */
.gold-rule{display:block;width:74px;height:3px;border-radius:var(--pill);background:var(--gold);margin:.85rem 0 1.35rem;}
.gold-rule--center{margin-inline:auto;}

/* slanted edge between bands (solid fills, no gradient) */
.sh-tilt{display:block;height:clamp(26px,4.5vw,54px);width:100%;position:relative;overflow:hidden;}
.sh-tilt--to-navy{background:var(--surface);}
.sh-tilt--to-navy::after{content:"";position:absolute;inset:0;background:var(--brand-500);clip-path:polygon(0 100%,100% 0,100% 100%);}
.sh-tilt--from-navy{background:var(--brand-500);}
.sh-tilt--from-navy::after{content:"";position:absolute;inset:0;background:var(--surface);clip-path:polygon(0 0,100% 0,0 100%);}
.sh-tilt--to-soft{background:var(--surface);}
.sh-tilt--to-soft::after{content:"";position:absolute;inset:0;background:var(--surface-soft);clip-path:polygon(0 100%,100% 0,100% 100%);}

/* ---------- hero slider, dark brand slides ---------- */
.hero--brand{background:var(--brand-900);padding:0;border:0;color:#fff;overflow:hidden;}
.hero--brand .hero-slide{min-height:clamp(460px,68vh,620px);}
.hero-photo--dark .hero-photo-scrim{background:rgba(16,28,63,.72);}
.hero-copy{max-width:38rem;}
.hero-copy .hero-kicker{display:inline-flex;align-items:center;gap:.5rem;font-size:.82rem;font-weight:700;
    color:var(--gold);background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.22);
    padding:.4rem 1rem;border-radius:var(--pill);margin-bottom:1.15rem;}
/* over a photo slide the light pill drops gold text below AA — use a solid dark chip */
.hero--brand .hero-photo .hero-kicker{background:rgba(16,28,63,.82);border-color:rgba(255,255,255,.18);}
.hero-copy h1,.hero-copy h2{color:#fff;font-size:clamp(1.6rem,4.2vw,2.85rem);font-weight:800;line-height:1.5;margin:0 0 .9rem;}
.hero-copy h1 .gold,.hero-copy h2 .gold{color:var(--gold);}
.hero-copy p{color:rgba(255,255,255,.88);font-size:1.02rem;line-height:2.1;margin:0 0 1.6rem;}
.hero-facts{display:flex;flex-wrap:wrap;gap:1.35rem;font-size:.85rem;color:rgba(255,255,255,.9);}
.btn-gold{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.74rem 1.6rem;
    border-radius:var(--pill);font-weight:800;font-size:.94rem;background:var(--gold);color:var(--brand-900);
    border:none;box-shadow:0 8px 22px rgba(16,28,63,.32);transition:all .18s ease;}
.btn-gold:hover{background:#E5BE00;color:var(--brand-900);transform:translateY(-1px);}
.btn-onnavy{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.7rem 1.5rem;
    border-radius:var(--pill);font-weight:700;font-size:.92rem;color:#fff;background:transparent;
    border:1.5px solid rgba(255,255,255,.45);transition:all .18s ease;}
.btn-onnavy:hover{background:rgba(255,255,255,.12);color:#fff;border-color:#fff;}
.hero--brand .hero-nav-btn{background:rgba(255,255,255,.10);border-color:rgba(255,255,255,.32);color:#fff;}
.hero--brand .hero-nav-btn:hover{background:var(--gold);color:var(--brand-900);border-color:var(--gold);}
.hero--brand .hero-dots [data-bs-target]{background:rgba(255,255,255,.42);}
.hero--brand .hero-dots [data-bs-target].active{background:var(--gold);}

/* ---------- quick access band ---------- */
.quick-band{background:var(--brand-500);padding:0;}
.quick-band .quick-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;
    max-width:1240px;margin:0 auto;}
.quick-tile{display:flex;align-items:center;justify-content:center;gap:.85rem;min-height:96px;
    padding:1.1rem 1.25rem;color:#fff;font-weight:700;font-size:.95rem;text-align:start;
    border-inline-start:1px solid rgba(255,255,255,.14);position:relative;transition:background-color .18s ease;}
.quick-tile:first-child{border-inline-start:0;}
.quick-tile::after{content:"";position:absolute;inset-inline:1.25rem;bottom:.55rem;height:2px;
    background:var(--gold);transform:scaleX(0);transform-origin:center;transition:transform .2s ease;}
.quick-tile:hover{background:rgba(255,255,255,.07);color:#fff;}
.quick-tile:hover::after{transform:scaleX(1);}
.quick-tile i,.quick-tile img{width:26px;font-size:1.35rem;color:var(--gold);flex:0 0 auto;text-align:center;}
.quick-tile small{display:block;font-weight:500;font-size:.75rem;color:rgba(255,255,255,.72);margin-top:2px;}

/* ---------- glass counters ---------- */
.sh-stats{position:relative;background:var(--brand-900);overflow:hidden;}
.sh-stats .hero-photo{min-height:0;}
.glass-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(14px,1.6vw,24px);position:relative;z-index:2;}
.glass-stat{background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.20);border-radius:var(--radius);
    padding:1.75rem 1.25rem;text-align:center;transition:transform .2s ease,background-color .2s ease;}
.glass-stat:hover{transform:translateY(-5px);background:rgba(255,255,255,.16);}
.glass-stat i{display:block;font-size:1.5rem;color:var(--gold);margin-bottom:.6rem;}
.glass-stat b{display:block;font-size:clamp(1.9rem,3.6vw,2.9rem);font-weight:800;color:#fff;
    line-height:1.25;font-variant-numeric:tabular-nums;}
.glass-stat span{display:block;font-size:.88rem;font-weight:600;color:rgba(255,255,255,.86);margin-top:.25rem;}

/* ---------- service / feature cards ---------- */
.svc-card{background:var(--surface-soft);border:1px solid var(--line);border-radius:var(--radius);
    padding:1.75rem;height:100%;transition:all .22s ease;}
.svc-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:var(--brand-200);}
.svc-card .feature-icon{background:var(--brand-100);border-color:var(--brand-200);color:var(--brand-700);}
.svc-card h3{font-size:1.05rem;font-weight:800;color:var(--ink-900);margin-bottom:.5rem;}
.svc-card p{font-size:.9rem;color:var(--ink-600);line-height:2;margin:0;}

/* ---------- cooperation / CTA ---------- */
.coop-tile{display:block;border-radius:var(--radius-md);overflow:hidden;border:1px solid rgba(255,255,255,.20);
    position:relative;min-height:190px;background:var(--brand-800);}
.coop-tile img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;transition:transform .35s ease;}
.coop-tile:hover img{transform:scale(1.05);}
.coop-tile figcaption{position:absolute;inset-inline:0;bottom:0;z-index:2;padding:1.1rem 1.25rem;
    background:rgba(16,28,63,.72);color:#fff;font-weight:700;font-size:.95rem;}
.cta-gold{background:var(--surface);border-radius:18px;border-inline-start:6px solid var(--gold);
    box-shadow:var(--shadow-pop);padding:clamp(1.4rem,3vw,2.25rem);
    display:flex;align-items:center;justify-content:space-between;gap:1.5rem;flex-wrap:wrap;}
.cta-gold h3{font-size:clamp(1.05rem,2.1vw,1.35rem);font-weight:800;color:var(--ink-900);margin:0 0 .35rem;}
.cta-gold p{margin:0;color:var(--ink-600);font-size:.92rem;line-height:1.95;}
.pill-row{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.85rem;}
.pill-row span{font-size:.75rem;font-weight:700;color:var(--brand-700);background:var(--brand-100);
    border:1px solid var(--brand-200);border-radius:var(--pill);padding:.3rem .8rem;}

/* ---------- about split ---------- */
.about-media{border-radius:var(--radius);overflow:hidden;border:1px solid rgba(255,255,255,.22);
    box-shadow:var(--shadow-pop);background:var(--brand-800);min-height:260px;position:relative;}
.about-media img{width:100%;height:100%;object-fit:cover;display:block;position:absolute;inset:0;}
.about-media--contain{background:var(--brand-50);border-color:var(--brand-200);box-shadow:none;min-height:300px;}
.about-media--contain img{object-fit:contain;padding:1.5rem;}

/* utility used by the counter band */
.inset-0{position:absolute;inset:0;}

/* ---------- navy footer ---------- */
.site-footer--navy{background:var(--brand-900);border-top:0;color:rgba(255,255,255,.80);}
.site-footer--navy h4{color:#fff;}
.site-footer--navy a{color:rgba(255,255,255,.80);}
.site-footer--navy a:hover{color:var(--gold);}
.site-footer--navy .footer-brand{color:#fff;}
.site-footer--navy .footer-brand img{background:#fff;border-color:rgba(255,255,255,.28);}
.site-footer--navy .footer-social a{background:rgba(255,255,255,.10);border-color:rgba(255,255,255,.22);color:#fff;}
.site-footer--navy .footer-social a:hover{background:var(--gold);color:var(--brand-900);border-color:var(--gold);}
.site-footer--navy .footer-app{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.18);}
.site-footer--navy .footer-app:hover{background:rgba(255,255,255,.13);}
.site-footer--navy .footer-app .app-label{color:rgba(255,255,255,.72);}
.site-footer--navy .footer-app .app-title{color:#fff;}
.site-footer--navy .footer-app i{color:var(--gold);}
.site-footer--navy .footer-bottom{border-top:1px dashed rgba(255,255,255,.20);color:rgba(255,255,255,.70);}

/* hero kicker needs an AA-safe variant when it sits on a light surface */
.sh-sec--navy .hero-kicker,.sh-stats .hero-kicker{color:var(--gold);background:rgba(255,255,255,.10);
    border-color:rgba(255,255,255,.24);}

/* ---------- responsive ---------- */
@media (max-width:991.98px){
    .quick-band .quick-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
    .quick-tile:nth-child(3){border-inline-start:0;}
    .quick-tile{border-top:1px solid rgba(255,255,255,.14);}
    .quick-tile:nth-child(-n+2){border-top:0;}
    .glass-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:575.98px){
    .quick-band .quick-grid{grid-template-columns:1fr;}
    .quick-tile{min-height:74px;border-inline-start:0;}
    .quick-tile:nth-child(2){border-top:1px solid rgba(255,255,255,.14);}
    .glass-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
    .glass-stat{padding:1.25rem .75rem;}
    .hero--brand .hero-slide{min-height:0;padding-block:2.75rem 5rem;}
    .cta-gold{flex-direction:column;align-items:flex-start;}
}
@media (prefers-reduced-motion:reduce){
    .coop-tile img,.glass-stat,.svc-card,.quick-tile{transition:none;}
}


