/* Option Two dress for the pages built before it: Add Your Thread, Give, Contact and
   Reflections. Their markup and scripts keep the earlier component names; this sheet gives
   those components the Option Two type, buttons, fields and panels so the whole site reads
   as one. Loaded after the page's own sheets, scoped to body.o2. */

/* Headlines: the display face at full weight, set tight, as on the day pages. */
body.o2 :is(.co-title,.display,.h-section){font-family:var(--o-display);font-weight:700;font-optical-sizing:none;font-variation-settings:"opsz" 28;letter-spacing:-.03em;line-height:.98;text-wrap:balance;color:var(--o-text)}
body.o2 .co-title{font-size:clamp(2.5rem,1.6rem + 3.6vw,4.6rem);margin:.6rem 0 1rem}
body.o2 .display{font-size:clamp(2.8rem,1.6rem + 4.4vw,5.2rem)}
body.o2 .h-section{font-size:clamp(1.9rem,1.4rem + 2vw,3rem)}
body.o2 :is(.co-card__title,.give-path h2,.co-after :is(h2,h3)){font-family:var(--o-display);font-weight:600;letter-spacing:-.015em}
body.o2 .co-after :is(h2,h3){font-size:1.25rem;text-transform:none;letter-spacing:-.01em;color:var(--o-text)}
body.o2 .h-small{font:600 1.1rem/1.3 var(--o-display);letter-spacing:-.01em}
body.o2 .eyebrow{font:600 .78rem/1.3 var(--o-sans);letter-spacing:.3em;text-transform:uppercase;color:var(--o-gold-ink)}
body.o2 :is(.lede,.support){color:var(--o-text-2);line-height:1.6}
body.o2 .lede--serif{font:400 clamp(1.2rem,1.05rem + .7vw,1.6rem)/1.42 var(--o-display);color:var(--o-text)}

/* Dark heads: the band sits under the sticky masthead, so it needs no room for an
   overlaid header, and its type turns to ivory and gold. */
body.o2 :is(.co-head,.ref-hero){padding:clamp(2.25rem,1.5rem + 3vw,4.5rem) 0 clamp(2rem,1.5rem + 2vw,3rem)}
body.o2 .co-head{background:radial-gradient(120% 140% at 85% -20%,rgba(201,151,58,.18),transparent 55%),var(--o-ink)}
body.o2 .co-head :is(.co-title,.display){color:var(--o-on-ink)}
body.o2 .co-head :is(.eyebrow){color:var(--o-gold-hi)}
body.o2 .co-head :is(.lede,p){color:var(--o-on-ink-2)}

/* Buttons: one pill, three jobs. Ink on ivory, gold on ink, an outline for the second choice. */
body.o2 .btn{min-height:52px;padding:0 1.6rem;border-radius:999px;font:600 1rem/1.2 var(--o-sans);letter-spacing:.01em}
body.o2 .btn--primary{background:var(--o-ink);color:#fff;box-shadow:0 10px 24px -14px rgba(13,11,9,.7)}
body.o2 .btn--primary:hover{background:#26201A}
body.o2 :is(.co-head,.theme-dark,.o2-ink) .btn--primary,body.o2 :is(.co-pay__btn,[data-contact-send],[data-co-continue],[data-ref-send],#ayt-send,#ayt-submit){background:var(--o-gold-grad);color:var(--o-ink);box-shadow:inset 0 1px 0 rgba(255,255,255,.45),0 10px 24px -14px rgba(120,80,20,.8)}
body.o2 .btn--ghost{background:transparent;color:var(--o-text);border-color:var(--o-text)}
body.o2 .btn--ghost:hover{background:var(--o-text);color:var(--o-ivory)}
body.o2 .btn--quiet{color:var(--o-gold-ink)}
body.o2 .btn--sm{min-height:44px;padding:0 1.2rem;font-size:.9rem}
body.o2 .btn--lg{min-height:56px;padding:0 2rem;font-size:1.05rem}
body.o2 .btn:disabled{opacity:.5}

/* Fields. */
body.o2 .field__label{font:600 .875rem/1.3 var(--o-sans);color:var(--o-text)}
body.o2 .field__input{min-height:48px;border:1px solid rgba(134,96,28,.32);border-radius:6px;background:#fffdf9;color:var(--o-text);font:400 1rem/1.35 var(--o-sans)}
body.o2 .field__input:hover{border-color:rgba(134,96,28,.55)}
body.o2 .field__input:focus{outline:none;border-color:var(--o-gold);box-shadow:0 0 0 3px rgba(184,137,59,.22)}
body.o2 :is(.field__hint,.caption){color:var(--o-text-3);font-size:.875rem;line-height:1.5}
body.o2 .check{font:400 .95rem/1.5 var(--o-sans);color:var(--o-text-2)}
body.o2 :is(.check,.radio) input{accent-color:var(--o-gold)}

/* Panels and cards share the Option Two panel: warm paper, a gold hairline, soft corners. */
body.o2 :is(.co-card,.panel,.give-path,.co-after,.co-summary__card,.ref-card,.fieldset){background:var(--o-ivory-2);border:1px solid var(--o-rule-soft);border-radius:10px}
body.o2 :is(.co-card,.panel){box-shadow:0 18px 40px -32px rgba(13,11,9,.45)}
body.o2 .co-card__n{background:var(--o-gold-grad);color:var(--o-ink)}
body.o2 :is(.give-path p,.co-after ol){color:var(--o-text-2)}

/* Notices read like the Option Two messages. */
body.o2 .notice{border:1px solid rgba(184,137,59,.45);border-left-width:3px;border-radius:6px;background:#FAF0D9;color:#5E440F}
body.o2 .notice--error{background:#FBEDEA;color:#7E2419;border-color:rgba(163,54,42,.35)}
body.o2 .notice--success{background:#EEF5EC;color:#24502E;border-color:rgba(47,107,67,.3)}
body.o2 .notice--muted{background:var(--o-ivory-2);color:var(--o-text-2);border-color:var(--o-rule-soft)}

/* Add Your Thread's own pieces. */
body.o2 .ayt-hero{border-bottom:1px solid var(--o-rule-soft)}
body.o2 .steps b{font-family:var(--o-display);color:var(--o-gold-ink)}
body.o2 .steps strong{font-family:var(--o-display);font-weight:600}
body.o2 .dropzone{border-color:var(--o-rule);background:var(--o-ivory-2);border-radius:10px}
body.o2 .section--light.texture{background:var(--o-ivory-2)}
body.o2 .faq summary{font-family:var(--o-display);font-weight:600}
/* Test-mode chip readable at a glance (it only appears with test keys). */
body.o2 .co-summary__test{color:#7A5414;border-color:#B8893B;background:#FAF0D9}
