/* The four Sanad brand colors. Tints use only these colors and transparency. */
:root{--brand-primary:#00BCB4;--brand-light:#004542;--brand-dark:#004542;--brand-white:#FFFFFF;--ink:var(--brand-dark);--teal:var(--brand-dark);--deep:var(--brand-dark);--aqua:var(--brand-primary);--paper:var(--brand-white);--ivory:color-mix(in srgb,var(--brand-light) 7%,var(--brand-white));--muted:color-mix(in srgb,var(--brand-dark) 82%,var(--brand-white));--line:color-mix(in srgb,var(--brand-dark) 15%,var(--brand-white))}
body{background:var(--brand-white);color:var(--brand-dark)}
::selection{background:var(--brand-light);color:var(--brand-dark)}
.site-header{background:color-mix(in srgb,var(--brand-white) 97%,transparent);border-color:var(--line)}
.desktop-nav,.eyebrow,.hero .eyebrow{color:var(--brand-dark)}
.button{background:var(--brand-primary);border-color:var(--brand-primary);color:var(--brand-dark)}
.button:hover,.button-light,.button-light:hover{background:var(--brand-light);border-color:var(--brand-light);color:var(--brand-dark)}
.button-outline{background:transparent;border-color:var(--brand-primary);color:var(--brand-dark)}
.button-outline:hover{background:var(--brand-light);color:var(--brand-dark)}
.text-link{color:inherit;border-color:var(--brand-primary)}
.hero.hero-open{background:var(--brand-white);border-color:var(--line)}
.hero-atmosphere{background:radial-gradient(ellipse at 50% 0%,var(--brand-white) 10%,transparent 65%),linear-gradient(120deg,var(--brand-white) 15%,color-mix(in srgb,var(--brand-light) 10%,var(--brand-white)) 70%,color-mix(in srgb,var(--brand-light) 40%,var(--brand-white)))}
.hero-open .hero-copy>.eyebrow{background:color-mix(in srgb,var(--brand-white) 80%,transparent);border-color:var(--line);color:var(--brand-dark)}
.hero-highlight{background:none;-webkit-text-fill-color:var(--brand-dark);color:var(--brand-dark)}
.hero-open .hero-description,.hero-open .hero-note,.hero-bottom,.hero-motion-control,.hero-open .explore{color:var(--muted)}
.hero-secondary{color:var(--brand-dark);border-color:var(--brand-primary)}
.hero-orbit{border-color:color-mix(in srgb,var(--brand-primary) 15%,transparent)}
.hero-bottom{border-color:var(--line)}
.flow-card{background:color-mix(in srgb,var(--brand-white) 92%,transparent);border-color:var(--line)}
.flow-icon{background:color-mix(in srgb,var(--brand-light) 30%,var(--brand-white));color:var(--brand-dark)}
.flow-label,.flow-card p,.flow-tick{color:var(--brand-dark)}
.flow-line{border-color:color-mix(in srgb,var(--brand-primary) 35%,transparent)}
.audiences{background:var(--brand-light);border-color:transparent}
.audience-inner .eyebrow,.audience-inner>div{color:var(--brand-dark)}
.about-photo>span{background:var(--brand-white);color:var(--brand-dark)}
.promise-panel{background:var(--brand-dark);color:var(--brand-white)}
.promise-panel>.eyebrow,.promise-panel h3 span:nth-child(2){color:var(--brand-light)}
.promise-panel p{color:var(--brand-white)}
.values svg,.values>div{color:var(--brand-dark)}
.services-section,.pricing-section{background:var(--ivory)}
.service-card,.plan{background:var(--brand-white);border-color:var(--line);color:var(--brand-dark)}
.service-card:hover{background:var(--brand-light);border-color:var(--brand-primary)}
.service-card p,.steps p,.plan>p,details p,.section-intro,.section-tail p,.pricing-note{color:var(--muted)}
.editorial:after{background:linear-gradient(90deg,color-mix(in srgb,var(--brand-dark) 92%,transparent),color-mix(in srgb,var(--brand-dark) 40%,transparent) 65%,color-mix(in srgb,var(--brand-dark) 20%,transparent))}
.editorial>.container,.faq-photo>div{color:var(--brand-white)}
.editorial .eyebrow{color:var(--brand-light)}
.steps>li{background:var(--brand-white);border-color:var(--line);color:var(--brand-dark)}
.steps .step-number,.steps li:first-child .step-number{background:var(--brand-primary);color:var(--brand-dark)}
.steps>li:hover,.steps>li:focus-within{background:var(--brand-light);border-color:var(--brand-primary)}
.steps>li:hover p,.steps>li:focus-within p{color:var(--brand-dark)}
.process-note{background:var(--brand-light);color:var(--brand-dark)}
.process-note>svg{color:var(--brand-dark)}
.featured{background:var(--brand-dark);border-color:var(--brand-dark);color:var(--brand-white)}
.featured>p,.featured li{color:var(--brand-white)}
.featured>svg,.featured li svg{color:var(--brand-light)}
.featured .quote-title{border-color:color-mix(in srgb,var(--brand-white) 25%,transparent)}
.plan-tag{background:var(--brand-light);color:var(--brand-dark)}
.plan li svg{color:var(--brand-dark)}.featured li svg{color:var(--brand-light)}
.faq-photo:after{background:linear-gradient(transparent,color-mix(in srgb,var(--brand-dark) 85%,transparent))}
summary>span:before,summary>span:after{background:var(--brand-dark)}
.contact-section{background:var(--brand-dark);color:var(--brand-white)}
.contact-section .eyebrow,.contact-signoff,.contact-links a>svg:first-child{color:var(--brand-light)}
.contact-description,.contact-links{color:var(--brand-white)}
.contact-links a{border-color:color-mix(in srgb,var(--brand-white) 22%,transparent)}
.form-panel{background:var(--brand-white);color:var(--brand-dark)}
.route-options{background:var(--ivory)}
.route-options input:checked+span{background:var(--brand-light);border-color:var(--brand-primary);color:var(--brand-dark)}
input:not([type=checkbox]):not([type=radio]),textarea{border-color:var(--line);color:var(--brand-dark)}
.enquiry-form .consent{color:var(--brand-dark)}
.form-notice,.preview-feedback{background:var(--ivory);border-color:var(--brand-primary);color:var(--brand-dark)}
.site-footer{background:var(--brand-white);color:var(--brand-dark)}
.footer-top p,.footer-bottom{color:var(--muted)}
.footer-bottom{border-color:var(--line)}
.footer-mark{background:var(--brand-dark)}
.round-link{border-color:var(--line)}.round-link:hover{background:var(--brand-light);color:var(--brand-dark)}

/* Dark highlight surfaces need light text and icons. */
::selection{background:var(--brand-light);color:var(--brand-white)}
.button:hover,.button-light,.button-light:hover,.button-outline:hover,.round-link:hover{color:var(--brand-white)}
.audience-inner .eyebrow,.audience-inner>div{color:var(--brand-white)}
.promise-panel>.eyebrow,.promise-panel h3 span:nth-child(2),.editorial .eyebrow,.featured>svg,.featured li svg,.contact-section .eyebrow,.contact-signoff,.contact-links a>svg:first-child{color:var(--brand-white)}
.service-card:hover,.service-card:hover p,.service-card:hover .card-top>span,.service-card:hover svg{color:var(--brand-white)}
.steps>li:hover,.steps>li:focus-within,.steps>li:hover p,.steps>li:focus-within p{color:var(--brand-white)}
.process-note,.process-note>svg,.plan-tag,.route-options input:checked+span{color:var(--brand-white)}
.plan-tag{border:1px solid var(--brand-primary)}

/* Equal outer columns keep navigation centered independently of logo/CTA widths. */
@media(min-width:801px){
  .site-header .header-inner{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:20px}
  .site-header .brand{justify-self:start;margin:0}
  .site-header .desktop-nav{justify-self:center;margin:0}
  .site-header .header-cta{justify-self:end}
}
@media(min-width:801px) and (max-width:950px){
  .site-header .header-inner{gap:12px}
  .site-header .desktop-nav{gap:12px}
  .site-header .desktop-nav a{font-size:13px}
  .site-header .brand-logo-only img{width:110px}
  .site-header .header-cta{font-size:12px;padding:10px;gap:10px}
}