/* Everyday Insight tool site template. Loaded after styles.css, so the tool's
   own components pick up the family colors and fonts through the variables. */
:root{
  --petrol:#19536b;--deep:#0d3646;--paper:#fdfcf7;--sun:#f3cf48;--mist:#c3d3da;--ochre:#86660a;--brick:#b8352b;
  --teal:#19536b;--teal-deep:#0d3646;--sea:#19536b;--sea-tint:#e8eff2;
  --coral:#b8352b;--coral-text:#9a2c24;--coral-tint:#f7e7e4;--amber:#486470;--amber-tint:#eef1f2;
  --ink:#0d3646;--ink-soft:#486470;--rule:#d0d8dc;--sand:#fdfcf7;--sand-deep:#f4f2ea;--cream:#ffffff;
  --card:#ffffff;--card-line:#e3e9ec;--rail:#c3d3da;--chip:#19536b;--chip-ink:#fdfcf7;--top:#19536b;
  --line:#d0d8dc;--track:#dfe6e9;
  /* Rating ramp for amounts and intensity, with the ink that reads on each step */
  --r1:#dee9ed;--r2:#b6ced8;--r3:#7ca4b6;--r4:#407c96;--r5:#19536b;--r-empty:#eef1f2;
  --r1-ink:#0d3646;--r2-ink:#0d3646;--r3-ink:#0d3646;--r4-ink:#fdfcf7;--r5-ink:#fdfcf7;
  --serif:Literata,Georgia,"Times New Roman",serif;
  --sans:"Source Sans 3",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  --max:72.5rem;
}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){
  --teal:#90c0d5;--teal-deep:#0c2632;--sea:#90c0d5;--sea-tint:#16394a;
  --coral:#f07a6d;--coral-text:#f49a8f;--coral-tint:#3a2422;--amber:#c3d3da;--amber-tint:#16394a;
  --ink:#fdfcf7;--ink-soft:#c3d3da;--rule:#2a5a70;--sand:#0c2632;--sand-deep:#102f3d;--cream:#123747;
  --card:#123747;--card-line:#204b5e;--rail:#2f6177;--chip:#90c0d5;--chip-ink:#0c2632;--top:#123f52;
  --line:#2a5a70;--track:#2a5a70;
  --r1:#23586e;--r2:#3d7a94;--r3:#6c9db3;--r4:#a3c5d4;--r5:#dcebf1;--r-empty:#16394a;
  --r1-ink:#fdfcf7;--r2-ink:#fdfcf7;--r3-ink:#0c2632;--r4-ink:#0c2632;--r5-ink:#0c2632;color-scheme:dark}}
:root[data-theme=dark]{
  --teal:#90c0d5;--teal-deep:#0c2632;--sea:#90c0d5;--sea-tint:#16394a;
  --coral:#f07a6d;--coral-text:#f49a8f;--coral-tint:#3a2422;--amber:#c3d3da;--amber-tint:#16394a;
  --ink:#fdfcf7;--ink-soft:#c3d3da;--rule:#2a5a70;--sand:#0c2632;--sand-deep:#102f3d;--cream:#123747;
  --card:#123747;--card-line:#204b5e;--rail:#2f6177;--chip:#90c0d5;--chip-ink:#0c2632;--top:#123f52;
  --line:#2a5a70;--track:#2a5a70;
  --r1:#23586e;--r2:#3d7a94;--r3:#6c9db3;--r4:#a3c5d4;--r5:#dcebf1;--r-empty:#16394a;
  --r1-ink:#fdfcf7;--r2-ink:#fdfcf7;--r3-ink:#0c2632;--r4-ink:#0c2632;--r5-ink:#0c2632;color-scheme:dark}

body{font-family:var(--sans);font-size:1.0625rem;line-height:1.6;font-variant-numeric:lining-nums}
h1,h2,h3,h4{font-family:var(--serif);font-weight:500;text-wrap:balance;letter-spacing:0}
a{color:var(--sea)}
a:hover{color:var(--ink)}
.fig{font-variant-numeric:lining-nums tabular-nums}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.wrap{max-width:var(--max);padding:0 clamp(16px,4vw,48px)}
.skip-link{border-color:var(--petrol)}

/* header: navy band on every page, the home page continues it into the hero */
.site-top{background:var(--top);color:var(--paper);position:relative}
.bar-top{display:flex;justify-content:space-between;align-items:center;gap:20px;padding-block:20px;flex-wrap:nowrap}
.tbrand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--paper)}
.tbrand:hover{color:var(--paper)}
.tbrand .ti{height:44px;width:44px;border-radius:10px;box-shadow:0 0 0 1.5px rgba(253,252,247,.35);flex:none}
.tbrand b{display:block;font:500 21px/1.1 var(--serif)}
.tbrand small{display:block;font:500 13px/1.3 var(--sans);color:var(--mist);margin-top:3px}
.site-top nav{display:flex;gap:24px;align-items:center;flex-wrap:wrap;font-weight:500;font-size:16px}
.site-top nav a{color:var(--mist);text-decoration:none;white-space:nowrap}
.site-top nav a:hover,.site-top nav a[aria-current=page]{color:var(--paper)}
.site-top nav a[aria-current=page]{text-decoration:underline;text-underline-offset:7px;text-decoration-thickness:2px}
.nl{display:flex;gap:22px;flex-wrap:wrap}
.lang{display:flex;gap:10px;align-items:center;color:var(--mist)}
.lang b{color:var(--paper);font-weight:500;border-bottom:3px solid var(--paper);line-height:1.4}
.menu,.menu:last-of-type{display:none;position:relative;border:0;padding:0}
.menu summary{list-style:none;cursor:pointer;color:var(--paper);font-weight:500;padding:9px 12px;border:1.5px solid rgba(195,211,218,.5);border-radius:9px}
.menu summary::-webkit-details-marker{display:none}
.menu summary::before{content:none}
.menu-in{position:absolute;right:0;top:calc(100% + 8px);z-index:20;background:var(--deep);border-radius:12px;padding:8px;min-width:230px;display:flex;flex-direction:column;box-shadow:0 18px 40px rgba(0,0,0,.25)}
.menu-in a{padding:12px 14px;border-radius:8px;color:var(--paper)!important}
.menu-in a:hover{background:#19536b}
.thm select{font:500 14px var(--sans);color:var(--paper);background:transparent;border:1.5px solid rgba(195,211,218,.5);border-radius:8px;padding:6px 8px;min-height:34px}
.thm option{color:#0d3646}
.site-top :focus-visible{outline:3px solid var(--sun);outline-offset:3px;border-radius:6px}
@media (max-width:1340px){html[lang=es] .nl{display:none}html[lang=es] .menu{display:block}html[lang=es] .site-top nav{gap:10px}}
@media (max-width:1040px){.nl{display:none}.menu,.menu:last-of-type{display:block}.site-top nav{gap:10px}}
@media (max-width:420px){.tbrand .ti{height:38px;width:38px}.tbrand b{font-size:18px}.tbrand small{font-size:12px}.thm select{font-size:13px;padding:6px 4px}}

/* home hero */
.hh-t h1{color:var(--paper);font-size:clamp(38px,5vw,62px);line-height:1.04;max-width:calc(50% - 36px);padding:clamp(18px,3vw,34px) 0 54px;margin:0}
.sunr{position:absolute;bottom:0;left:max(clamp(16px,4vw,48px),calc(50vw - 36.25rem + 48px));width:64px;height:32px;border-radius:64px 64px 0 0;background:var(--sun);animation:rise 1.6s cubic-bezier(.2,.7,.2,1) both}
@keyframes rise{from{transform:translateY(18px);clip-path:inset(0 0 60% 0)}to{transform:none;clip-path:inset(0 0 0 0)}}
@media (prefers-reduced-motion:reduce){.sunr{animation:none}}
.hb{padding-bottom:clamp(24px,3vw,40px)}
.hb .in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"t c" "w c";gap:0 clamp(32px,4.5vw,72px)}
.hb .t{grid-area:t;padding-top:36px}
.hb .lead{font-size:clamp(17px,1.5vw,19px);line-height:1.6;color:var(--ink-soft);margin:0 0 26px;max-width:34em}
.acts{display:flex;gap:24px;align-items:center;flex-wrap:wrap}
.tl{color:var(--sea);font-weight:600;text-underline-offset:6px;text-decoration-thickness:2px}
.hb .note{margin:18px 0 0}
.hcard{grid-area:c;margin-top:calc(-1 * clamp(210px,21vw,268px));position:relative;z-index:2}
.ways{grid-area:w;list-style:none;margin:30px 0 0;padding:0;align-self:start}
.ways li{padding:13px 0;border-top:1px solid var(--rule);display:grid;grid-template-columns:150px 1fr;gap:16px;margin:0}
.ways b{font:500 17px var(--serif)} .ways b a{color:var(--ink);text-underline-offset:4px} .ways span{color:var(--ink-soft);font-size:15.5px;line-height:1.5}
@media (max-width:860px){.hh-t h1{max-width:none}.hb .in{grid-template-columns:1fr;grid-template-areas:"t" "c" "w"}.hcard{margin-top:28px}.ways li{grid-template-columns:1fr;gap:2px}}

/* the nine-step record card */
.r9{margin:0;background:var(--card);border:1px solid var(--rule);border-radius:14px;padding:18px 24px 10px;color:var(--ink);box-shadow:0 18px 40px rgba(8,30,40,.14)}
.r9 figcaption{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font:600 12px var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft);padding-bottom:10px}
.r9 figcaption a{letter-spacing:0;text-transform:none;font-weight:500;font-size:14px}
.r9 ol{list-style:none;margin:0;padding:0}
.r9 li{position:relative;display:grid;grid-template-columns:22px 1fr;gap:0 14px;padding:8px 0 10px;margin:0}
.r9 li+li{border-top:1px solid var(--card-line)}
.r9 li:not(:last-child):after{content:"";position:absolute;left:10.25px;top:30px;bottom:-9px;border-left:1.5px solid var(--rail)}
.r9 .n{position:relative;z-index:1;grid-row:span 2;width:22px;height:22px;border-radius:50%;background:var(--chip);color:var(--chip-ink);font:600 11.5px/22px var(--sans);text-align:center;margin-top:1px;box-shadow:0 0 0 3px var(--card)}
.r9 .l{font:600 12.5px/1.35 var(--sans);color:var(--ink-soft)}
.r9 p{margin:2px 0 0;font-size:15px;line-height:1.45}
.r9 .q{font-family:var(--serif);font-weight:500;font-size:15.5px}
.r9 .bel{white-space:nowrap;font:600 12.5px var(--sans);color:var(--ink-soft);margin-left:4px}
.r9 .bel.blk{display:block;margin:4px 0 0}
.r9 .v{font-weight:600}
.r9 .c{display:inline-block;background:var(--chip);color:var(--chip-ink);border-radius:5px;padding:2px 6px;margin-left:2px;font:600 12px var(--sans)}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .r9{box-shadow:0 18px 40px rgba(0,0,0,.35)}}
:root[data-theme=dark] .r9{box-shadow:0 18px 40px rgba(0,0,0,.35)}

/* components from the tool, in the family style */
.btn{border-radius:10px;font-weight:600}
.btn.primary{background:var(--petrol);border-color:var(--petrol);color:var(--paper);padding:.8rem 1.3rem}
.btn.primary:hover{background:var(--deep);border-color:var(--deep);color:var(--paper)}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .btn.primary{background:#90c0d5;border-color:#90c0d5;color:#0c2632}:root:not([data-theme=light]) .btn.primary:hover{background:#c3d3da;color:#0c2632}}
:root[data-theme=dark] .btn.primary{background:#90c0d5;border-color:#90c0d5;color:#0c2632}:root[data-theme=dark] .btn.primary:hover{background:#c3d3da;color:#0c2632}
.pill,.pill.warm,.pill.mid{background:var(--chip);color:var(--chip-ink)}
.kicker{color:var(--ink-soft);font-size:.8rem;letter-spacing:.08em;text-transform:uppercase}
.section.teal{background:var(--petrol);color:#e3ecef}
main:has(> .section.teal:last-child)+.foot{margin-top:0}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .section.teal{background:#1b4455}}
:root[data-theme="dark"] .section.teal{background:#1b4455}
.section.teal h2,.section.teal h3{color:var(--paper)}
.section.teal a,.section.teal .kicker{color:var(--paper)!important}
.steps li::before{background:var(--chip);color:var(--chip-ink);font-family:var(--sans);font-size:.95rem}
.hero{padding:clamp(40px,6vw,64px) 0 clamp(20px,3vw,32px)}
.hero h1{font-size:clamp(34px,4.4vw,52px);line-height:1.08;max-width:20ch}
.hero .lede{font-size:clamp(17px,1.5vw,19.5px)}
/* no boxed callouts or side rules: a callout is a paragraph with a quiet label */
.callout{border:0;background:none;padding:0;border-radius:0;margin:1.4rem 0}
.callout.caution,.callout.example{background:none;border:0}
.callout.caution::before{content:none}
.check{border-left:0;border-radius:8px;background:var(--sea-tint)}
.crisis{border-left:0;border-radius:12px;background:var(--sea-tint)}
.chip[aria-pressed=true]{background:var(--petrol);border-color:var(--petrol);color:var(--paper)}
.hot-choice[aria-pressed=true]{border-color:var(--petrol);background:var(--sea-tint)}
.hotline{background:var(--sea-tint)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .chip[aria-pressed=true]{background:#90c0d5;border-color:#90c0d5;color:#0c2632}}
:root[data-theme="dark"] .chip[aria-pressed=true]{background:#90c0d5;border-color:#90c0d5;color:#0c2632}
.next-read{background:none;border:0;border-top:1px solid var(--rule);border-radius:0;padding:1.1rem 0 0}
.sheet{background:var(--card);border-color:var(--rule)}
.site-header,.site-footer{display:none}

/* footer, as on the company site, with this site's own links first */
.foot{background:var(--deep);color:var(--mist);font-size:15px;margin-top:clamp(48px,6vw,80px)}
.foot a{color:var(--mist);text-underline-offset:3px;white-space:nowrap}
.foot a:hover{color:var(--paper)}
.foot-site{padding-top:36px;padding-bottom:4px;line-height:1.9}
.foot-site nav{color:var(--mist)}
.foot-site p{margin:.4rem 0 0}
.foot-in{display:grid;grid-template-columns:auto 1fr auto;gap:28px;padding-block:28px 32px;border-top:1px solid rgba(195,211,218,.22);margin-top:22px}
.foot-in img{height:34px;width:auto;display:block}
.fl{line-height:1.9}
.legal{padding-bottom:36px}
.legal p{margin:0;padding-top:18px;border-top:1px solid rgba(195,211,218,.22);font-size:14px;line-height:1.6;max-width:62em;color:var(--mist)}
@media (max-width:860px){.foot-in{grid-template-columns:1fr}}
@media print{.site-top,.foot{display:none}}
.downloads a:not(.inline){color:var(--sea);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px;display:inline-block}
.start{max-width:44em;margin:0 0 2rem}.start h2{margin-top:0;font-size:1.6rem}.hero:has(.scale-pick){padding-bottom:1.5rem}
.start+.callout{max-width:44em}
@media (max-width:520px){.site-top nav{flex-wrap:nowrap;gap:8px}.tbrand{gap:10px;min-width:0}.tbrand .ti{width:38px;height:38px}.tbrand b{font-size:18px}.menu summary{padding:8px 10px}.lang{gap:6px}}
@media (max-width:520px){.lang b{display:none}.tbrand small{font-size:11.5px;line-height:1.25}}
@media (min-width:861px){.hh-t h1{min-height:calc(3.12em + clamp(18px,3vw,34px) + 54px)}}
/* Behavioral Experiment pieces */
.range-row output{flex:none}
.pill.unrated{background:transparent;color:var(--ink-soft);border:1px solid var(--line);font-weight:600}
.callout,.callout.caution{font-weight:400}
.downloads{list-style:none;padding:0;margin:0 0 1rem}
.downloads li{border-top:1px solid var(--rule);padding:.9rem 0;margin:0}
.downloads li:last-child{border-bottom:1px solid var(--rule)}
.downloads .dl-title,.downloads a:not(.inline){font-family:var(--serif);font-size:1.2rem;font-weight:600;display:block;margin-bottom:.15rem}
.downloads .dl-title{color:var(--ink)}
.downloads .meta{display:block}
.downloads a.inline{font-weight:600}
.sheet h2.sh3{margin-top:0;font-size:1.1rem}@media print{.sheet h2.sh3{break-after:avoid}}
/* Rating ramp chips: distress on the ladder and the add-a-rung rating */
.rv.r1{background:var(--r1);color:var(--r1-ink)}.rv.r2{background:var(--r2);color:var(--r2-ink)}.rv.r3{background:var(--r3);color:var(--r3-ink)}
.rv.r4{background:var(--r4);color:var(--r4-ink)}.rv.r5{background:var(--r5);color:var(--r5-ink)}
.foot .marks{border-top:0;padding-top:10px;font-size:13px}

/* The page title sits the same distance below the header on every inner page.
   The home page keeps its own hero spacing. */
:root{--head-gap:clamp(44px,5.3vw,72px)}
main:not(:has(.hb)){padding-top:var(--head-gap)}
main:not(:has(.hb))>:first-child,
main:not(:has(.hb))>:first-child>:first-child,
main:not(:has(.hb))>:first-child>:first-child>:first-child,
main:not(:has(.hb))>:first-child>:first-child>:first-child>:first-child{margin-top:0;padding-top:0}

/* Reading column and group downloads, October 2026. The text column scales with the screen, from 40rem on laptops to 58rem on large monitors, and body text grows slightly on large screens. */
.wrap.read{max-width:calc(clamp(40rem,58vw,58rem) + 2*clamp(16px,4vw,48px));font-size:max(1em,.85rem + .25vw)}
.dl-wrap{overflow-x:auto;margin:.4rem 0 1.4rem;max-width:44rem}
.dl-table{width:100%;border-collapse:collapse;font-size:.97em}
.dl-table th,.dl-table td{text-align:left;vertical-align:top;padding:.6rem 1rem .6rem 0;border-bottom:1px solid var(--line)}
.dl-table thead th{font-weight:600;font-size:.88em;color:var(--ink-soft);padding-top:0}
.dl-table tbody th{font-weight:600;white-space:nowrap}
.dl-table .pages{display:block;color:var(--ink-soft);font-size:.9em}
.read{max-width:clamp(40rem,58vw,58rem)}
.hero>.note{max-width:clamp(40rem,58vw,58rem)}

/* Footer, October 20, 2026: the dividers line up with the text, and the disclaimer and notices run the full width. */
.foot-in{border-top:0;position:relative}
.foot-in::before{content:"";position:absolute;top:0;left:clamp(16px,4vw,48px);right:clamp(16px,4vw,48px);border-top:1px solid rgba(195,211,218,.22)}
.legal p{max-width:none}