/* ==========================================================================
   Sovren Asset Management — sovrenam.com
   Built to "Sovren — home page, build reference", Direction 6B, Sept 2026.
   Every colour, size and spacing value below is taken literally from that
   reference. Fonts are self-hosted: no CDN request is made at runtime.
   ========================================================================== */

/* ── Faces ─── Newsreader (site display) + Archivo (sans). Variable, latin
   + latin-ext. STIX Two Text is the investor-materials face and is not
   shipped here. ────────────────────────────────────────────────────────── */
@font-face{font-family:"Newsreader";font-style:italic;font-weight:300 700;font-display:swap;src:url("assets/fonts/newsreader-italic-300_700-latin-ext.woff2") format("woff2");unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:"Newsreader";font-style:italic;font-weight:300 700;font-display:swap;src:url("assets/fonts/newsreader-italic-300_700-latin.woff2") format("woff2");unicode-range:U+0020-00FF, U+0131, U+0152-0153, U+2009, U+2013-2014, U+2018-2019, U+201C-201D, U+2020-2021, U+2026, U+202F, U+20AC, U+2122, U+2191, U+2193, U+2212}
@font-face{font-family:"Newsreader";font-style:normal;font-weight:300 700;font-display:swap;src:url("assets/fonts/newsreader-normal-300_700-latin-ext.woff2") format("woff2");unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:"Newsreader";font-style:normal;font-weight:300 700;font-display:swap;src:url("assets/fonts/newsreader-normal-300_700-latin.woff2") format("woff2");unicode-range:U+0020-00FF, U+0131, U+0152-0153, U+2009, U+2013-2014, U+2018-2019, U+201C-201D, U+2020-2021, U+2026, U+202F, U+20AC, U+2122, U+2191, U+2193, U+2212}
@font-face{font-family:"Archivo";font-style:normal;font-weight:400 700;font-display:swap;src:url("assets/fonts/archivo-normal-400_700-latin-ext.woff2") format("woff2");unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:"Archivo";font-style:normal;font-weight:400 700;font-display:swap;src:url("assets/fonts/archivo-normal-400_700-latin.woff2") format("woff2");unicode-range:U+0020-00FF, U+0131, U+0152-0153, U+2009, U+2013-2014, U+2018-2019, U+201C-201D, U+2020-2021, U+2026, U+202F, U+20AC, U+2122, U+2191, U+2193, U+2212}

:root{
  --font-display:Newsreader,"Times New Roman",serif;
  --font-sans:Archivo,system-ui,-apple-system,sans-serif;

  /* The whole palette. Hierarchy is one ink thinned — there is no grey. */
  --ground:#FBF9F5;          /* page ground; the only background on the page */
  --ink:#14120E;             /* display ink — wordmark, research title       */
  --accent:#C05A1E;          /* the single accent; no second orange exists   */
  --ink-68:rgba(20,18,14,.68);   /* standfirst */
  --ink-55:rgba(20,18,14,.55);   /* labels     */
  --hair:rgba(20,18,14,.13);     /* hairlines  */

  --gutter:clamp(24px,5vw,64px);
}

*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  background:var(--ground); color:var(--ink-68);
  font-family:var(--font-sans); -webkit-font-smoothing:antialiased;
  /* "One screen, three elements" — the page fills the viewport so the research
     row sits at its foot rather than leaving empty ground beneath. svh first:
     100vh overshoots on mobile browsers with a collapsing toolbar. */
  min-height:100vh; min-height:100svh; display:flex; flex-direction:column;
}
main{flex:1 0 auto; display:flex; flex-direction:column}
img,svg{display:block}
a{color:inherit;text-decoration:none}
a:focus-visible{outline:2px solid var(--accent);outline-offset:3px}

/* ── Header ─── 34px vertical padding. Mark left, address right, nothing
   between. No rule beneath, no sticky behaviour. ───────────────────────── */
.head{display:flex;align-items:center;justify-content:space-between;gap:32px;
  padding:34px var(--gutter)}
.head__mark img{height:60px;width:auto}     /* descriptor line resolves at this size */
.head__mail{font:400 14px/1 var(--font-sans);color:var(--accent);
  padding:16px 0;margin:-16px 0}   /* 44px tap target; box position unchanged */
.head__mail:hover{color:var(--ink)}

/* ── Hero ─── overflow:hidden so the arch clips at the page edge; the
   min-height keeps the crown dot out of that clip. ─────────────────────── */
.hero{position:relative;overflow:hidden;min-height:404px;flex:1 0 auto;
  padding:clamp(72px,11vw,132px) var(--gutter) clamp(80px,12vw,140px)}
.hero__body{position:relative;z-index:1;width:100%}

.wordmark{font-family:var(--font-sans);font-weight:600;
  font-size:clamp(36px,11.5vw,76px);line-height:1;letter-spacing:.3em;
  text-transform:uppercase;color:var(--ink)}
/* Not a typed period — Archivo's period is square. */
.wordmark .dot{display:inline-block;width:.15em;height:.15em;border-radius:50%;
  background:var(--accent);letter-spacing:0;margin-left:-.14em;vertical-align:baseline}

.standfirst{margin-top:30px;
  font:italic 400 clamp(17px,2.1vw,20px)/1.55 var(--font-display);color:var(--ink-68)}

/* ── Arch ─── 470x356, behind the text, at .45. Semicircle-topped frame with
   no bottom border, filled with concentric hairline arcs. ──────────────── */
.arch{position:absolute;right:-40px;bottom:0;z-index:0;pointer-events:none;
  opacity:.45;width:470px;height:356px}
/* Values taken from the reference's rendered ArchMark, not its prose summary:
   the outer ring does carry a 1px bottom border, and the inner ring is drawn
   in cream at .18 — on this paper ground that is all but invisible, which is
   why the reference reads as a single arch. Kept as the component has it. */
.arch__ring{position:absolute;inset:0;
  border:1px solid rgba(16,40,62,.62);
  border-radius:235px 235px 0 0;
  background:repeating-radial-gradient(circle at 50% 100%,
    transparent 0 5px, rgba(16,40,62,.26) 5px 6px)}
.arch__ring--inner{inset:38px 38px 0;border-radius:197px 197px 0 0;background:none;
  border-color:rgba(242,239,231,.18);border-bottom:0}
.arch__dot{position:absolute;top:-6px;left:50%;margin-left:-6px;
  width:12px;height:12px;border-radius:50%;background:var(--accent)}

/* ── Research row ─── a single link, justified to both gutters. ────────── */
.research{border-top:1px solid var(--hair);padding:26px var(--gutter) 32px}
.research__label{display:block;
  font:600 12px/1 var(--font-sans);letter-spacing:.2em;text-transform:uppercase;
  color:var(--ink-55)}
.research__row{display:flex;align-items:baseline;justify-content:space-between;
  gap:26px;margin-top:14px;color:var(--ink)}
.research__row:hover{color:var(--accent)}
.research__title{font:400 18px/1.5 var(--font-display);max-width:700px}
.research__pdf{font:700 12px/1 var(--font-sans);letter-spacing:.16em;
  color:var(--accent);white-space:nowrap}

/* ── Narrow viewports ─── the brand system holds a desktop floor and ships
   no mobile layout; these are the reference's recommended decisions. ───── */
@media (max-width:900px){
  /* do not shrink the arch — the hairline arcs alias */
  .arch{display:none}
  /* With the arch gone nothing anchors the hero's foot, so the slack from
     filling the viewport is centred rather than pooled below the standfirst. */
  .hero{min-height:0;display:flex;align-items:center}
}
/* Below 560px, per the reference's 390px artboard: the header swaps the full
   lockup for the S.A.M. mark alone at 26px (the two will not share a row), the
   standfirst drops to 17px, and the research title and PDF mark stack.
   Tracking stays at .3em at every size — it is what ties the wordmark to the
   logo — and the page never grows a menu. */
@media (max-width:560px){
  .head{gap:16px;padding:22px var(--gutter)}
  .head__mark img{height:36px}
  .head__mail{font-size:12px;white-space:nowrap}
  .standfirst{margin-top:26px;font-size:17px}
  .research{padding:22px var(--gutter) 28px}
  .research__row{flex-direction:column;align-items:flex-start;gap:12px;margin-top:12px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* ── 404 ─── same hero; the only link on the page takes the accent, underlined
   so it is distinguishable from the sentence around it without relying on
   colour alone (WCAG 1.4.1). ──────────────────────────────────────────────── */
.notfound a{color:var(--accent);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.14em}
.notfound a:hover{color:var(--ink)}

/* O1 */
:root{--measure:1200px}
@media (min-width:901px){
  .head,.hero,.research{padding-inline:max(var(--gutter),(100% - var(--measure))/2)}
  .arch{right:max(var(--gutter),(100% - var(--measure))/2)}
  .hero{flex:1 0 auto;display:flex;align-items:center;min-height:0;
    padding-block:clamp(64px,6vw,104px)}
  .research{padding-block:clamp(40px,4vw,56px) clamp(44px,4.5vw,64px)}
}