/* Ramirez Labs — layout for support, privacy, and research pages.
   Tokens, reset, body and link styles live in tokens.css, which every page
   loads first. This file only adds the sub-page document layout. */

/* Page container for every sub-page. */
.sheet{
 max-width:1080px;
 margin:0 auto;
 padding:0 var(--gutter) 1rem;
}

/* ---------- masthead ---------- */

.masthead{padding:1.75rem 0 clamp(2.5rem,6vw,4rem);}

.wordmark{
 font-family:var(--mono);
 font-weight:600;
 font-size:.92rem;
 letter-spacing:.12em;
 text-transform:uppercase;
 margin:0 0 clamp(2rem,6vw,3.5rem);
 color:var(--ink);
}
.wordmark a{color:inherit;border-bottom:none;}
.wordmark a:hover{color:var(--measure);}

/* On sub-pages the tagline names the document: "FloraFang · Privacy" */
.tagline{
 font-family:var(--mono);
 font-weight:500;
 font-size:clamp(1.5rem,4.4vw,2.4rem);
 line-height:1.15;
 letter-spacing:-.03em;
 color:var(--ink);
 margin:0;
 max-width:20ch;
}

/* ---------- sections ---------- */

section{padding:0 0 1rem;}

.eyebrow{
 font-family:var(--mono);
 font-size:.75rem;
 letter-spacing:.18em;
 text-transform:uppercase;
 color:var(--slate);
 margin:0 0 1.4rem;
}

h2{
 font-family:var(--mono);
 font-weight:500;
 font-size:clamp(1.35rem,3vw,1.9rem);
 letter-spacing:-.02em;
 line-height:1.2;
 margin:0 0 1.1rem;
}

h3{
 font-family:var(--mono);
 font-weight:600;
 font-size:1.02rem;
 letter-spacing:-.01em;
 margin:2rem 0 .4rem;
}

p{max-width:var(--measure-width);}
ul{max-width:var(--measure-width);padding-left:1.15rem;}
li{margin-bottom:.4rem;}

/* ---------- question blocks ---------- */
/* Ruled like the survey rod on the landing page: a baseline with ticks. */

.qa{
 position:relative;
 border-top:1px solid var(--grid);
 padding:1.6rem 0;
}
.qa::after{
 content:"";
 position:absolute;
 inset:0 0 auto 0;
 height:7px;
 background-image:linear-gradient(90deg,var(--stone) 1px,transparent 1px);
 background-size:32px 100%;
 opacity:.5;
}
.qa:last-of-type{border-bottom:1px solid var(--grid);}
.qa h3{margin:0 0 .35rem;font-size:1rem;}
.qa p{margin:0;}

/* ---------- callout ---------- */

.callout{
 background:var(--paper-raised);
 border:1px solid var(--stone);
 border-left:3px solid var(--measure);
 padding:1.25rem 1.4rem;
 margin:2.5rem 0 0;
 max-width:var(--measure-width);
}
.callout p{margin:0;font-size:.94rem;}

/* ---------- utility ---------- */

.updated{
 font-family:var(--mono);
 font-size:.72rem;
 letter-spacing:.1em;
 text-transform:uppercase;
 color:var(--slate);
 margin:0 0 2rem;
}

.backlink{
 display:inline-block;
 font-family:var(--mono);
 font-size:.78rem;
 letter-spacing:.06em;
 margin-top:3rem;
}

footer{
 margin-top:2.5rem;
 padding:2rem 0 3.5rem;
 border-top:1px solid var(--ink);
 font-family:var(--mono);
 font-size:.72rem;
 letter-spacing:.1em;
 text-transform:uppercase;
 color:var(--slate);
 display:flex;
 justify-content:space-between;
 gap:1rem;
 flex-wrap:wrap;
}
footer a{color:var(--slate);border-bottom:none;}
footer a:hover{color:var(--measure);}