/* Saudi Thought Leadership — shared article shell (inherits Ora brand DNA) */
:root{
  --green:#1B3A2F;--ink:#10211A;--gold:#B0894A;--gold-2:#C6A361;
  --cream:#ECE5D6;--cream-deep:#E3DAC7;--white:#FFFFFF;
  --ink-soft:#46524A;--on-green:#DCE0D5;--on-green-soft:#9EAA9D;
  --line-green:rgba(176,137,74,.32);--line-light:rgba(16,33,26,.12);
  --pad:clamp(22px,5vw,80px);
  --e-out:cubic-bezier(.23,1,.32,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:'Instrument Sans',system-ui,sans-serif;background:var(--cream);color:var(--ink);line-height:1.65;font-size:17px;-webkit-font-smoothing:antialiased;overflow-x:hidden}
h1,h2,h3{font-family:'Fraunces',Georgia,serif;font-weight:600;line-height:1.12;letter-spacing:-.005em}
a{color:inherit}
.wrap{max-width:1200px;margin:0 auto;padding-left:var(--pad);padding-right:var(--pad)}
.mono-mark{background-image:url(/mono.png);background-position:center;background-repeat:no-repeat;background-size:contain;display:inline-block}

/* nav — always solid on sub-pages */
header.nav{position:fixed;top:0;left:0;right:0;z-index:60;background:rgba(20,42,33,.96);backdrop-filter:blur(10px);border-bottom:1px solid var(--line-green);padding:12px 0}
.nav-inner{display:flex;align-items:center;justify-content:space-between;max-width:1200px;margin:0 auto;padding-left:var(--pad);padding-right:var(--pad)}
.nav-bar{width:1px;height:32px;background:var(--line-green);flex:none}
/* sub-pages carry the monogram alone; the full name lives on the homepage hero */
.nav .nav-bar,.nav .nav-name{display:none}
.nav-logo{display:flex;align-items:center;gap:12px;text-decoration:none}
.nav-mono{width:28px;aspect-ratio:362/431}
.nav-name{display:flex;flex-direction:column;line-height:1}
.nav-name .o{font-family:'Fraunces',serif;font-weight:500;font-size:1.2rem;color:var(--cream);letter-spacing:.01em}
.nav-name .d{font-family:'Instrument Sans',sans-serif;font-size:.55rem;font-weight:600;letter-spacing:.28em;text-transform:uppercase;color:var(--gold);margin-top:3px}
.nav-links{display:flex;align-items:center;gap:24px;list-style:none}
.nav-links a{position:relative;color:var(--on-green);text-decoration:none;font-size:.85rem;font-weight:500;letter-spacing:.03em;transition:color .2s var(--e-out)}
.nav-links a:hover{color:var(--white)}
.nav-links a.on{color:var(--gold-2);font-weight:600}
.nav-links a.on::after{content:"";position:absolute;left:50%;bottom:-9px;width:6px;height:6px;background:var(--gold);transform:translateX(-50%) rotate(45deg)}
.nav-cta{border:1px solid var(--gold);color:var(--gold)!important;padding:8px 18px;letter-spacing:.1em;text-transform:uppercase;font-size:.7rem!important;transition:background .2s var(--e-out),color .2s var(--e-out)}
.nav-cta:hover{background:var(--gold);color:var(--ink)!important}
.nav-toggle{display:none;background:none;border:0;cursor:pointer;width:34px;height:34px;flex-direction:column;justify-content:center;gap:6px;flex:none}
.nav-toggle span{display:block;height:1.5px;width:24px;background:var(--on-green);transition:.3s var(--e-out)}
.nav-toggle.open span:nth-child(1){transform:translateY(7.5px) rotate(45deg)}
.nav-toggle.open span:nth-child(2){opacity:0}
.nav-toggle.open span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg)}
@media (max-width:760px){
  /* mobile menu: one full-cover opaque overlay, list centered — matches homepage */
  header.nav{backdrop-filter:none;-webkit-backdrop-filter:none}
  .nav-logo,.nav-toggle{position:relative;z-index:71}
  .nav-toggle{display:flex}
  .nav-links{position:fixed;inset:0;width:100%;height:100dvh;margin:0;background:linear-gradient(rgba(16,33,26,.8),rgba(20,42,33,.83)),url(/diriyah-hero.jpg) center/cover no-repeat,var(--ink);flex-direction:column;align-items:center;justify-content:center;gap:30px;padding:88px 40px 48px;transform:translateX(100%);transition:transform .45s var(--e-out);z-index:65;overflow-y:auto}
  .nav-links.open{transform:none}
  .nav-links a{font-size:1.2rem}
  .nav-links a.on::after{left:-22px;top:50%;bottom:auto;transform:translateY(-50%) rotate(45deg)}
  .nav-cta{margin-top:10px}
}
@media (prefers-reduced-motion:reduce){.nav-links,.nav-toggle span{transition:none}}

/* article hero band */
.art-hero{background:radial-gradient(140% 120% at 82% -15%,#234a3c,var(--green) 52%,var(--ink));color:var(--on-green);padding:150px 0 56px}
.art-kicker{font-family:'Spectral',Georgia,serif;font-style:italic;font-size:1.04rem;color:var(--gold-2);display:block;margin-bottom:14px}
.art-hero h1{font-size:clamp(1.9rem,4.4vw,3.2rem);color:var(--white);max-width:22ch}
.art-hero h1 em{font-style:italic;font-weight:500;color:var(--gold-2)}
.art-meta{margin-top:20px;font-size:.86rem;letter-spacing:.12em;text-transform:uppercase;color:var(--on-green-soft);line-height:1.5}
.art-meta b{color:var(--gold);font-weight:600}
.art-meta .am-line{display:block;margin-top:7px}
.art-standfirst{font-family:'Spectral',Georgia,serif;font-style:italic;font-size:clamp(1.06rem,1.7vw,1.3rem);color:#EDE7DA;max-width:56ch;margin-top:18px;line-height:1.5}

/* optional banner image — page works with or without the file */
.art-banner{display:block;width:100%;max-width:880px;margin:clamp(28px,4vw,44px) auto 0;border:1px solid var(--line-light)}

/* article body */
.art-body{max-width:760px;margin:0 auto;padding:clamp(40px,6vw,64px) var(--pad) clamp(56px,8vw,88px)}
.art-body>p{margin-bottom:1.15em;color:var(--ink);font-size:1.04rem}
.art-body .lead{font-family:'Fraunces',serif;font-size:clamp(1.15rem,1.9vw,1.38rem);line-height:1.45;color:var(--ink);margin-bottom:1.2em}
.art-body h2{font-size:clamp(1.4rem,2.5vw,1.85rem);margin:1.9em 0 .7em;color:var(--ink);max-width:26ch}
.art-body h3{font-size:1.14rem;margin:1.6em 0 .55em;color:var(--green)}
.art-body ul,.art-body ol{list-style:none;margin:0 0 1.2em}
.art-body li{position:relative;padding:4px 0 4px 18px;color:var(--ink-soft);font-size:1rem}
.art-body li::before{content:"";position:absolute;left:0;top:.72em;width:5px;height:5px;border-radius:50%;background:var(--gold)}
.art-body ol{counter-reset:artol}
.art-body ol>li{counter-increment:artol;padding-left:30px}
.art-body ol>li::before{content:counter(artol,decimal-leading-zero);position:absolute;left:0;top:.18em;width:auto;height:auto;border-radius:0;background:none;font-family:'Fraunces',serif;font-weight:600;color:var(--gold);font-size:.95em}
.art-body li b,.art-body li strong{color:var(--ink)}
.art-body blockquote{font-family:'Spectral',Georgia,serif;font-style:italic;font-size:clamp(1.12rem,1.9vw,1.34rem);line-height:1.5;color:var(--green);border-left:3px solid var(--gold);padding:6px 0 6px 22px;margin:1.5em 0}
.art-body blockquote cite{display:block;font-family:'Instrument Sans',sans-serif;font-style:normal;font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;color:var(--gold);margin-top:10px}
.art-body hr{border:0;height:1px;background:var(--line-light);margin:2.2em 0}
.art-rule{display:flex;align-items:center;justify-content:center;gap:14px;margin:2.4em auto}
.art-rule::before,.art-rule::after{content:"";height:1px;width:clamp(34px,7vw,58px)}
.art-rule::before{background:linear-gradient(90deg,transparent,var(--gold))}
.art-rule::after{background:linear-gradient(90deg,var(--gold),transparent)}
.art-rule i{width:7px;height:7px;background:var(--gold);transform:rotate(45deg);flex:none}

/* boardroom questions / callout */
.ask{background:var(--green);color:var(--on-green);border-left:3px solid var(--gold);padding:clamp(26px,4vw,38px);margin:2.2em 0 0;transition:transform .3s var(--e-out),box-shadow .3s var(--e-out)}
@media (any-hover:hover) and (any-pointer:fine){
  .ask:hover{transform:translateY(-3px);box-shadow:0 14px 32px rgba(16,33,26,.16)}
}
.ask h2,.ask h3{color:var(--white);margin:0 0 .8em;font-size:1.3rem;max-width:none}
.ask li{color:var(--on-green)}
.ask li b,.ask li strong{color:var(--gold-2)}
.ask p{color:var(--on-green);margin-bottom:1em}

/* in-brief box */
.brief{background:var(--cream-deep);border:1px solid var(--line-light);padding:clamp(22px,3vw,30px);margin:0 0 2em}
.brief .k{font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);font-weight:600;display:block;margin-bottom:12px}
.brief li{font-size:.98rem}

/* guest bio */
.guest{border-top:1px solid var(--line-light);margin-top:2.4em;padding-top:1.6em}
.guest .k{font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);font-weight:600;display:block;margin-bottom:10px}
.guest p{font-size:.95rem;color:var(--ink-soft)}

/* prev / next + library link */
/* article share row — lives at the end of the article body, above the navigation band */
.art-share{background:transparent}
.art-share-inner{max-width:760px;margin:0 auto;padding:clamp(30px,4.5vw,44px) var(--pad) 0;display:flex;justify-content:center;align-items:center;gap:18px;flex-wrap:wrap}
.as-label{display:inline-flex;align-items:center;gap:12px;font-size:.72rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:#8a6a33}
.as-label i{width:6px;height:6px;background:var(--gold);transform:rotate(45deg);flex:none}
.as-icons{display:inline-flex;gap:14px}
.as-icons a{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:50%;border:1px solid var(--gold);color:#8a6a33;transition:background .25s var(--e-out),color .25s var(--e-out),transform .2s var(--e-out)}
.as-icons a:hover{background:var(--gold);color:var(--ink);transform:translateY(-3px)}
.as-icons svg{width:18px;height:18px}
.as-one{position:relative;display:inline-flex;align-items:center;gap:12px;background:none;border:none;padding:12px 6px;font:inherit;font-size:.72rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:#8a6a33;cursor:pointer;transition:color .3s var(--e-out)}
.as-one i{width:6px;height:6px;background:var(--gold);transform:rotate(45deg);flex:none;transition:transform .45s var(--e-out),background .3s var(--e-out)}
.as-one::before,.as-one::after{content:"";position:absolute;left:0;right:0;height:1px;background:var(--gold);opacity:.5;transform:scaleX(.55);transition:transform .45s var(--e-out),opacity .3s var(--e-out)}
.as-one::before{top:0;transform-origin:left center}
.as-one::after{bottom:0;transform-origin:right center}
.as-one:hover{color:var(--green)}
.as-one:hover::before,.as-one:hover::after{transform:scaleX(1);opacity:1}
.as-one:hover i{transform:rotate(225deg);background:var(--gold-2)}
.as-one:active i{transform:scale(.8) rotate(225deg)}
.as-one .glyphs{display:inline-flex;align-items:center;gap:9px;margin-left:2px;opacity:.75;transition:opacity .3s var(--e-out)}
.as-one .glyphs svg{width:14px;height:14px;fill:currentColor}
.as-one:hover .glyphs{opacity:1}
.as-one .gsep{width:1px;height:14px;background:var(--gold);opacity:.5}

.art-nav{background:var(--cream-deep);border-top:1px solid var(--line-light)}
.art-nav-inner{max-width:760px;margin:0 auto;padding:clamp(30px,4vw,42px) var(--pad);display:flex;justify-content:space-between;align-items:center;gap:18px;flex-wrap:wrap}
.art-nav a{position:relative;display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:var(--green);font-weight:600;font-size:.92rem;padding:9px 4px;transition:color .3s var(--e-out)}
.art-nav a i{width:6px;height:6px;background:var(--gold);transform:rotate(45deg);transition:transform .45s var(--e-out),background .3s var(--e-out);flex:none}
.art-nav a::before,.art-nav a::after{content:"";position:absolute;left:0;right:0;height:1px;background:var(--gold);opacity:.5;transform:scaleX(.5);transition:transform .45s var(--e-out),opacity .3s var(--e-out)}
.art-nav a::before{top:0;transform-origin:left center}
.art-nav a::after{bottom:0;transform-origin:right center}
.art-nav a:hover{color:#8a6a33}
.art-nav a:hover::before,.art-nav a:hover::after{transform:scaleX(1);opacity:1}
.art-nav a:hover i{transform:rotate(225deg);background:var(--gold-2)}
.art-nav .lib{font-family:'Spectral',serif;font-style:italic;font-weight:400}

/* footer */
footer.strip{background:var(--green);color:var(--on-green);padding:34px 0}
.strip-inner{max-width:1200px;margin:0 auto;padding:0 var(--pad);display:flex;justify-content:space-between;align-items:center;gap:18px;flex-wrap:wrap}
.strip .sig{font-family:'Spectral',serif;font-style:italic;color:var(--gold);font-size:.95rem}
.strip .copy{font-size:.8rem;color:var(--on-green-soft)}
.strip a{color:var(--on-green);text-decoration:none;border-bottom:1px solid var(--gold);padding-bottom:1px}
.strip a:hover{color:var(--gold)}
.strip a.pv{font-size:.8rem;color:var(--on-green-soft);border-bottom-color:var(--line-green)}
.strip a.pv:hover{color:var(--gold-2)}

/* library page */
.lib-head{padding:150px 0 64px;background:radial-gradient(140% 120% at 82% -15%,#234a3c,var(--green) 52%,var(--ink));color:var(--on-green)}
.lib-head h1{font-size:clamp(2rem,4.8vw,3.4rem);color:var(--white);max-width:20ch}
.lib-head h1 em{font-style:italic;font-weight:500;color:var(--gold-2)}
.lib-head .sub{font-family:'Spectral',serif;font-style:italic;font-size:clamp(1.05rem,1.7vw,1.3rem);color:#EDE7DA;max-width:52ch;margin-top:16px}
/* library intro — the think tank introduces itself before the editions */
.lib-intro{background:var(--cream);border-bottom:1px solid var(--line-light)}
.li-grid{max-width:860px;margin:0 auto;padding:clamp(40px,6vw,64px) var(--pad);display:grid;grid-template-columns:1.15fr 1fr;gap:clamp(28px,5vw,56px);align-items:center}
.li-copy .kick{font-family:'Spectral',Georgia,serif;font-style:italic;color:#8a6a33;font-size:1rem;margin-bottom:10px}
.li-copy .kick::before{content:"";display:inline-block;width:6px;height:6px;background:var(--gold);transform:rotate(45deg);margin-right:.7em;vertical-align:2px}
.li-copy p{color:var(--ink-soft);font-size:.99rem;line-height:1.75}
.strands{display:grid;gap:14px}
.strand{background:var(--white);border:1px solid var(--line-light);border-left:2px solid var(--gold);padding:20px 22px;transition:transform .3s var(--e-out),border-color .3s var(--e-out),box-shadow .3s var(--e-out)}
@media (any-hover:hover) and (any-pointer:fine){
  .strand:hover{transform:translateY(-4px);border-color:var(--gold);box-shadow:0 10px 24px rgba(16,33,26,.1)}
}
.strand h3{font-size:1.12rem;color:var(--ink);margin-bottom:6px}
.strand p{font-size:.88rem;color:var(--ink-soft);line-height:1.6}
@media (max-width:760px){.li-grid{grid-template-columns:1fr;gap:24px}}

.strand-link{position:relative;display:inline-flex;align-items:center;gap:10px;text-decoration:none;padding:9px 4px;margin-top:10px;font-size:.66rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#8a6a33;transition:color .3s var(--e-out)}
.strand-link i{width:6px;height:6px;background:var(--gold);transform:rotate(45deg);flex:none;transition:transform .45s var(--e-out),background .3s var(--e-out)}
.strand-link::before,.strand-link::after{content:"";position:absolute;left:0;right:0;height:1px;background:var(--gold);opacity:.5;transform:scaleX(.5);transition:transform .45s var(--e-out),opacity .3s var(--e-out)}
.strand-link::before{top:0;transform-origin:left center}
.strand-link::after{bottom:0;transform-origin:right center}
.strand-link:hover{color:var(--green)}
.strand-link:hover::before,.strand-link:hover::after{transform:scaleX(1);opacity:1}
.strand-link:hover i{transform:rotate(225deg);background:var(--gold-2)}

/* STL Conversations nominations */
.nom{background:radial-gradient(115% 90% at 50% -5%,rgba(176,137,74,.12),transparent 55%),var(--green);color:var(--on-green);padding:clamp(48px,7vw,80px) 0}
.nom-grid{max-width:980px;margin:0 auto;padding:0 var(--pad);display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(30px,5vw,60px);align-items:start}
.nom-kick{font-family:'Spectral',Georgia,serif;font-style:italic;color:var(--gold-2);font-size:1rem;margin-bottom:12px}
.nom h2{font-family:'Fraunces',serif;font-weight:600;font-size:clamp(1.5rem,2.8vw,2.1rem);color:var(--white);line-height:1.15;max-width:20ch}
.nom .lead{color:var(--on-green);font-size:.96rem;margin-top:14px;max-width:36ch}
.nom .conf{font-size:.84rem;color:var(--on-green-soft);border-left:2px solid var(--gold);padding-left:14px;line-height:1.65;margin-top:18px;max-width:36ch}
.nom .conf a{color:var(--on-green-soft);border-bottom:1px solid var(--line-green);padding-bottom:1px;text-decoration:none}
.nom .conf a:hover{color:var(--gold-2)}
.nform{display:grid;grid-template-columns:1fr 1fr;gap:15px}
.nform .full{grid-column:1/-1}
.nform label{display:block;font-size:.67rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);font-weight:600;margin-bottom:6px}
.nform input,.nform select,.nform textarea{width:100%;background:rgba(16,33,26,.55);border:1px solid var(--line-green);color:var(--white);font:inherit;font-size:.95rem;padding:11px 13px}
.nform input:focus,.nform select:focus,.nform textarea:focus{outline:none;border-color:var(--gold)}
.nform select{appearance:none;-webkit-appearance:none;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none' stroke='%23B0894A' stroke-width='1.6'%3E%3Cpath d='M1 1.5 6 6.5l5-5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;padding-right:34px}
.nform option{color:#10211A;background:#ECE5D6}
.nform textarea{resize:vertical;min-height:80px}
.nform .nomself-hide.hidden{display:none}
.nsubmit{grid-column:1/-1;justify-self:start;background:var(--gold);color:var(--ink);border:1px solid var(--gold);padding:14px 32px;font:inherit;font-size:.78rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;transition:background .2s var(--e-out),transform .18s var(--e-out)}
.nsubmit:hover{background:var(--gold-2);transform:translateY(-2px)}
.nsubmit:disabled{opacity:.55;cursor:default;transform:none}
.nom-status{grid-column:1/-1;font-family:'Spectral',Georgia,serif;font-style:italic;font-size:1rem}
.nom-status.ok{color:var(--gold-2)}
.nom-status.err{color:#E7B7A2}
@media (max-width:800px){.nom-grid{grid-template-columns:1fr}.nform{grid-template-columns:1fr}}

.lib-list{max-width:860px;margin:0 auto;padding:clamp(44px,6vw,72px) var(--pad)}
.ed{display:grid;grid-template-columns:auto 1fr;gap:clamp(18px,3vw,40px);padding:clamp(26px,3.6vw,40px) 0;border-bottom:1px solid var(--line-light);align-items:baseline}
.ed:first-child{padding-top:0}
.ed-n{font-family:'Fraunces',serif;font-size:clamp(1.5rem,2.8vw,2.1rem);font-weight:600;color:var(--gold);line-height:1;font-variant-numeric:tabular-nums}
.ed-b .tag{display:inline-block;font-size:.64rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ink);background:var(--gold);padding:3px 9px;font-weight:700;margin-bottom:10px}
.ed-b .date{font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);display:block;margin-bottom:6px}
.ed-b h2{font-size:clamp(1.25rem,2.2vw,1.7rem);max-width:none;margin:0 0 10px}
.ed-b h2 a{text-decoration:none;color:var(--ink);transition:color .2s var(--e-out)}
.ed-b h2 a:hover{color:var(--gold)}
.ed-b p{color:var(--ink-soft);font-size:.98rem;max-width:60ch;margin-bottom:12px}
.ed-b .go{position:relative;display:inline-flex;align-items:center;gap:10px;font-size:.68rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#8a6a33;text-decoration:none;padding:9px 4px;transition:color .3s var(--e-out)}
.ed-b .go i{width:6px;height:6px;background:var(--gold);transform:rotate(45deg);transition:transform .45s var(--e-out),background .3s var(--e-out);flex:none}
.ed-b .go::before,.ed-b .go::after{content:"";position:absolute;left:0;right:0;height:1px;background:var(--gold);opacity:.5;transform:scaleX(.5);transition:transform .45s var(--e-out),opacity .3s var(--e-out)}
.ed-b .go::before{top:0;transform-origin:left center}
.ed-b .go::after{bottom:0;transform-origin:right center}
.ed-b .go:hover{color:var(--green)}
.ed-b .go:hover::before,.ed-b .go:hover::after{transform:scaleX(1);opacity:1}
.ed-b .go:hover i{transform:rotate(225deg);background:var(--gold-2)}
@media (max-width:640px){.ed{grid-template-columns:1fr;gap:8px}}
@media (prefers-reduced-motion:reduce){
  .strand,.ask,.strand-link i,.art-nav a i,.ed-b .go i,.as-icons a,.why-cell,.sme-step{transition:none!important}
}