/* ============================================================
   TYPE SCALE — every size on this page comes from this list.
   Nine steps, two tracking values. Don't add new ones; reach
   for the nearest existing step instead.
   ============================================================ */
:root{
  --navy:#0D1B2E;
  --navy-deep:#060F1C;
  --navy-soft:#16293F;
  --gold:#C6A15B;
  --gold-bright:#DCBE83;
  --gold-ink:#8A6A24;
  --ivory:#F7F4ED;
  --ivory-dim:#EDE7DA;
  --slate:#93A2B6;

  --display:"Cormorant Garamond",Garamond,Georgia,serif;
  --body:"Jost",system-ui,-apple-system,sans-serif;

  --t-micro:12px;                      /* every uppercase label */
  --t-small:14px;                      /* meta, notes, fine print */
  --t-body:17px;                       /* body copy */
  --t-lead:20px;                       /* intros, values, chart names */
  --t-title:24px;                      /* headings within a block */
  --t-figure:34px;                     /* numerals */
  --t-quote:clamp(24px,3.2vw,34px);
  --t-head:clamp(32px,4.5vw,50px);
  --t-hero:clamp(44px,8vw,86px);

  --track:.22em;                       /* uppercase labels */
  --track-display:.01em;               /* serif headings */

  --wrap:1180px;
  --gut:clamp(22px,5vw,64px);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--ivory);color:var(--navy);
  font-family:var(--body);font-size:var(--t-body);font-weight:300;line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
.wrap{max-width:var(--wrap);margin:0 auto;padding-inline:var(--gut)}

h1,h2,h3{font-family:var(--display);font-weight:400;line-height:1.12;margin:0;
  letter-spacing:var(--track-display)}
h2{font-size:var(--t-head)}
h3{font-size:var(--t-title)}

/* one treatment for every uppercase label on the page */
.eyebrow,.hero__place,.nav__links a,.nav__cta,.btn,.gen__tag,.ped__colhead,
.dogbox__role,.dogbox__cl,.reg-name,.foot__brand small,label,
.specs li>span:first-child{
  font-family:var(--body);font-size:var(--t-micro);font-weight:400;
  letter-spacing:var(--track);text-transform:uppercase;
}

.eyebrow{color:var(--gold-ink);margin:0 0 20px}
.sec--dark .eyebrow{color:var(--gold)}

.rule{width:54px;height:1px;background:var(--gold);margin:26px 0;border:0}
.rule--center{margin-inline:auto}

.fill{color:var(--gold-ink);border-bottom:1px dotted var(--gold);font-style:italic}
.sec--dark .fill{color:var(--gold-bright)}

.mono{width:62px;height:62px;flex:0 0 auto}
.mono--sm{width:34px;height:34px}

/* ---------- nav ---------- */
.nav{position:sticky;top:0;z-index:60;background:rgba(13,27,46,.96);backdrop-filter:blur(10px)}
.nav__in{max-width:var(--wrap);margin:0 auto;padding:16px var(--gut);
  display:flex;align-items:center;justify-content:space-between;gap:24px}
.nav__brand{display:flex;align-items:center;gap:12px;text-decoration:none}
.nav__brand span{font-family:var(--display);font-size:var(--t-lead);line-height:1;
  color:var(--ivory);letter-spacing:var(--track-display);white-space:nowrap}
.nav__links{display:flex;align-items:center;gap:26px;list-style:none;margin:0;padding:0}
.nav__links a{color:rgba(247,244,237,.72);text-decoration:none;white-space:nowrap;transition:color .2s}
.nav__links a:hover{color:var(--gold)}
.nav__cta{color:var(--gold);text-decoration:none;border:1px solid var(--gold);
  padding:11px 20px;transition:.2s}
.nav__cta:hover{background:var(--gold);color:var(--navy-deep)}
/* the Apply button covers this on wide screens; the list item is for the phone menu */
@media(min-width:1201px){.nav__links li:last-child{display:none}}
.nav__verse{
  font-family:var(--body);font-size:var(--t-micro);letter-spacing:var(--track);
  text-transform:uppercase;color:var(--gold);white-space:nowrap;
  padding-left:18px;margin-left:2px;border-left:1px solid rgba(198,161,91,.35);
}
.nav__burger{display:none;background:none;border:0;cursor:pointer;padding:8px;color:var(--ivory)}
.nav__burger span{display:block;width:22px;height:1px;background:currentColor;margin:5px 0}
@media(max-width:1200px){
  .nav__links{display:none;position:absolute;top:100%;left:0;right:0;
    flex-direction:column;align-items:stretch;gap:0;
    background:var(--navy);border-top:1px solid rgba(198,161,91,.3)}
  .nav__links.open{display:flex}
  .nav__links li{border-bottom:1px solid rgba(247,244,237,.1)}
  .nav__links a{display:block;padding:16px var(--gut)}
  .nav__burger{display:block}
  .nav__cta{display:none}
  .nav__verse{display:none}
}

/* ---------- hero ---------- */
/* The photograph runs full bleed. Text sits low, over the dark dune grass,
   and the scrim ramps to solid navy at the bottom so the hero melts into
   the section beneath it. Adjust --hero-focus to move the crop up or down. */
.hero{
  --hero-focus:58%;
  position:relative;isolation:isolate;overflow:hidden;
  min-height:min(calc(100svh - 76px),880px);
  display:flex;align-items:flex-end;
  background:var(--navy);color:var(--ivory);text-align:center;
  padding:clamp(90px,14vh,150px) 0 clamp(54px,8vh,86px);
}
.hero__bg{position:absolute;inset:0;z-index:-2}
.hero__bg picture{display:block;width:100%;height:100%}
.hero__bg img{width:100%;height:100%;object-fit:cover;object-position:50% var(--hero-focus)}
.hero__scrim{
  position:absolute;inset:0;z-index:-1;
  background:
    linear-gradient(to bottom,
      rgba(13,27,46,.62) 0%,
      rgba(13,27,46,.26) 16%,
      rgba(13,27,46,.10) 34%,
      rgba(13,27,46,.34) 52%,
      rgba(13,27,46,.74) 68%,
      rgba(13,27,46,.93) 84%,
      var(--navy) 100%),
    linear-gradient(to right,
      rgba(13,27,46,.30) 0%, rgba(13,27,46,0) 28%,
      rgba(13,27,46,0) 72%, rgba(13,27,46,.30) 100%);
}
.hero .wrap{position:relative}
.hero__mono{margin:0 auto 26px}
.hero h1{font-size:var(--t-hero);font-weight:300;color:var(--ivory);
  text-shadow:0 2px 28px rgba(6,15,28,.6)}
.hero h1 em{font-style:normal;display:block;color:var(--gold);
  font-family:var(--body);font-size:var(--t-title);font-weight:300;
  letter-spacing:var(--track);text-transform:uppercase;margin-top:22px}
.hero__place{margin:24px 0 0;color:rgba(247,244,237,.72)}
.hero__lede{margin:26px auto 0;max-width:52ch;font-size:var(--t-lead);
  color:rgba(247,244,237,.92);text-shadow:0 1px 16px rgba(6,15,28,.75)}
.hero__cta{display:flex;flex-wrap:wrap;gap:16px;justify-content:center;margin-top:36px}

/* on a phone the frame is far taller than it is wide, so pull the crop
   toward the dog and give the text more room beneath him */
@media(max-width:700px){
  .hero{--hero-focus:50%;min-height:min(calc(100svh - 68px),740px);
    padding-top:clamp(60px,10vh,90px)}
}

.band{background:var(--navy);padding:0 0 clamp(50px,8vw,90px)}
.band__frame{position:relative;padding:10px;border:1px solid rgba(198,161,91,.38)}
.band__frame img{width:100%;height:auto}
@media(max-width:700px){
  .band__frame{padding:6px}
  .band__frame img{aspect-ratio:5/4;object-fit:cover;object-position:62% 50%}
}

/* ---------- photo placeholders ---------- */
.photo{background:var(--ivory-dim);border:1px solid rgba(13,27,46,.14);
  display:flex;align-items:center;justify-content:center;text-align:center;
  padding:26px;color:rgba(13,27,46,.5);font-size:var(--t-small);line-height:1.6}
.photo img{width:100%;height:100%;object-fit:cover}
.photo--filled{padding:0;border-color:rgba(198,161,91,.45);background:var(--navy-soft)}
.sec--dark .photo{background:var(--navy-soft);border-color:rgba(198,161,91,.26);color:var(--slate)}

/* ---------- buttons ---------- */
.btn{display:inline-block;text-decoration:none;padding:16px 32px;
  border:1px solid transparent;cursor:pointer;transition:.22s ease}
.btn--gold{background:var(--gold);color:var(--navy-deep);border-color:var(--gold)}
.btn--gold:hover{background:var(--gold-bright);border-color:var(--gold-bright)}
.btn--outline{background:transparent;color:var(--ivory);border-color:rgba(247,244,237,.4)}
.btn--outline:hover{border-color:var(--gold);color:var(--gold)}
.btn--navy{background:var(--navy);color:var(--ivory);border-color:var(--navy)}
.btn--navy:hover{background:var(--navy-soft);border-color:var(--navy-soft)}
:focus-visible{outline:2px solid var(--gold);outline-offset:4px}

/* ---------- sections ---------- */
.sec{padding:clamp(70px,10vw,130px) 0}
section[id],header[id]{scroll-margin-top:72px}
.sec--dim{background:var(--ivory-dim)}
.sec--dark{background:var(--navy);color:var(--ivory)}
.sec--dark h2,.sec--dark h3{color:var(--ivory)}
.sec__head{max-width:60ch;margin-bottom:clamp(44px,6vw,72px)}
.sec__head--center{margin-inline:auto;text-align:center}
.sec__head p{margin:24px 0 0;font-size:var(--t-lead);opacity:.82}

/* ---------- external link ---------- */
.gen__link{color:var(--gold);text-decoration:none;white-space:nowrap;
  border-bottom:1px solid rgba(198,161,91,.45);transition:border-color .2s}
.gen__link:hover{border-bottom-color:var(--gold)}
.gen__link svg{width:9px;height:9px;display:inline-block;margin-left:4px;vertical-align:baseline}
.gen__link--ink{color:var(--gold-bright);border-bottom-color:rgba(220,190,131,.45)}

/* ---------- bloodline ---------- */
.gens{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(198,161,91,.3)}
.gen{background:var(--navy);padding:44px 34px 40px}
.gen--now{background:var(--navy-soft)}
.gen__num{font-family:var(--display);font-size:var(--t-figure);font-weight:300;
  color:var(--gold);line-height:1;margin:0 0 18px}
.gen__tag{color:var(--slate);margin:0 0 12px}
.gen__name{font-family:var(--display);font-size:var(--t-title);font-weight:400;
  line-height:1.2;margin:0 0 14px;color:var(--ivory)}
.gen__note{margin:0;font-size:var(--t-body);line-height:1.7;color:rgba(247,244,237,.8)}
@media(max-width:860px){.gens{grid-template-columns:1fr}}

/* ---------- split ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(34px,6vw,80px);align-items:center}
.split .photo{aspect-ratio:4/5}
.split--flip .photo{order:2}
@media(max-width:860px){
  .split{grid-template-columns:1fr}
  .split--flip .photo{order:0}
  .split .photo{aspect-ratio:4/3}
  .split .photo--filled{aspect-ratio:4/5;max-width:440px;margin-inline:auto}
}
.reg-name{margin:10px 0 0;opacity:.6}
.dam__more{margin:22px 0 0}
.dam__more .gen__link{color:var(--gold-ink);border-bottom-color:rgba(138,106,36,.4);
  font-size:var(--t-micro);letter-spacing:var(--track);text-transform:uppercase}
.btn--quiet{background:transparent;color:var(--navy);border-color:rgba(13,27,46,.35);margin-left:10px}
.btn--quiet:hover{border-color:var(--navy);background:rgba(13,27,46,.05)}
@media(max-width:620px){.btn--quiet{margin:12px 0 0;display:block;text-align:center}}

/* ---------- specs ---------- */
.specs{list-style:none;margin:34px 0 0;padding:0;border-top:1px solid rgba(13,27,46,.16)}
.specs li{display:flex;justify-content:space-between;align-items:baseline;gap:24px;
  padding:14px 0;border-bottom:1px solid rgba(13,27,46,.16)}
.specs li>span:first-child{opacity:.6}
.specs li>span:last-child{text-align:right;font-family:var(--display);font-size:var(--t-lead)}

/* ---------- pedigree ---------- */
.ped__cols{display:none;grid-template-columns:1.25fr 1fr 1fr;gap:28px;margin-bottom:14px}
@media(min-width:861px){.ped__cols{display:grid}}
.ped__colhead{color:rgba(247,244,237,.45);margin:0}

.ped{display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:28px}
.ped__col{display:grid;gap:12px;position:relative}

/* bracket: a spine down each gutter, with a tick out to every card */
.ped__col--2::after,.ped__col--3::after{
  content:"";position:absolute;left:-14px;top:9%;bottom:9%;
  width:1px;background:rgba(198,161,91,.26);
}
.ped__col--2 .dogbox::before,.ped__col--3 .dogbox::before{
  content:"";position:absolute;right:100%;top:50%;
  width:14px;height:1px;background:rgba(198,161,91,.26);
}
.ped__col--1{grid-template-rows:repeat(2,1fr)}
.ped__col--2{grid-template-rows:repeat(4,1fr)}
.ped__col--3{grid-template-rows:repeat(8,1fr)}

.dogbox{position:relative;border:1px solid rgba(198,161,91,.3);padding:18px 20px;
  display:flex;flex-direction:column;align-self:center;min-height:0;
  background:rgba(255,255,255,.015)}
.dogbox--lead{background:rgba(198,161,91,.09);border-color:rgba(198,161,91,.55)}
.dogbox__role{color:var(--slate);margin:0 0 8px}
.dogbox__name{font-family:var(--display);font-size:var(--t-lead);font-weight:400;
  line-height:1.25;margin:0;color:var(--ivory)}
.dogbox--lead .dogbox__name{font-size:var(--t-title);color:var(--gold-bright)}
.dogbox__reg{margin:8px 0 0;font-size:var(--t-small);line-height:1.5;color:rgba(247,244,237,.5)}
.dogbox__cl{margin:10px 0 0;color:var(--gold);display:flex;flex-wrap:wrap;gap:4px 12px}
.dogbox .gen__link{margin-top:10px;align-self:flex-start;
  font-size:var(--t-micro);letter-spacing:var(--track);text-transform:uppercase}
.ped__note{margin:30px 0 0;max-width:74ch;font-size:var(--t-body);line-height:1.75;
  color:rgba(247,244,237,.72)}

@media(max-width:860px){
  .ped{grid-template-columns:1fr;gap:0}
  .ped__col{gap:10px;margin-bottom:10px}
  .ped__col--2::after,.ped__col--3::after{display:none}
  .ped__col--2 .dogbox::before,.ped__col--3 .dogbox::before{display:none}
  .ped__col--1,.ped__col--2,.ped__col--3{grid-template-rows:none}
  .ped__col::before{
    content:attr(data-gen);display:block;
    font-family:var(--body);font-size:var(--t-micro);letter-spacing:var(--track);
    text-transform:uppercase;color:rgba(247,244,237,.45);
    padding:22px 0 10px;border-top:1px solid rgba(198,161,91,.22);margin-top:12px;
  }
  .ped__col--1::before{border-top:0;margin-top:0;padding-top:0}
}

/* ---------- litter cards ---------- */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(248px,1fr));
  gap:1px;background:rgba(198,161,91,.3)}
.card{background:var(--navy);padding:38px 32px}
.card h3{margin:0 0 8px}
.card .amt{font-family:var(--display);font-size:var(--t-figure);color:var(--gold);
  line-height:1.1;display:block;margin-bottom:12px}
.card p{margin:0;font-size:var(--t-body);line-height:1.7;color:rgba(247,244,237,.82)}

/* ---------- included ---------- */
.checks{list-style:none;margin:0;padding:0;columns:2;column-gap:60px}
.checks li{break-inside:avoid;padding:0 0 16px 32px;position:relative}
.checks li::before{content:"";position:absolute;left:2px;top:11px;width:13px;height:6px;
  border-left:1px solid var(--gold-ink);border-bottom:1px solid var(--gold-ink);
  transform:rotate(-45deg)}
@media(max-width:700px){.checks{columns:1}}

/* ---------- pull quote ---------- */
.pull{text-align:center;max-width:46ch;margin:0 auto}
.pull p{font-family:var(--display);font-size:var(--t-quote);font-style:italic;
  font-weight:300;line-height:1.35;margin:0;color:var(--ivory)}

/* ---------- form ---------- */
.form{display:grid;grid-template-columns:1fr 1fr;gap:24px;max-width:780px}
.field{display:flex;flex-direction:column;gap:9px}
.field--full{grid-column:1/-1}
label{opacity:.7}
input,textarea,select{font-family:var(--body);font-size:var(--t-body);font-weight:300;
  color:var(--navy);background:transparent;border:0;
  border-bottom:1px solid rgba(13,27,46,.3);padding:11px 2px;border-radius:0;
  transition:border-color .2s}
input:focus,textarea:focus,select:focus{border-bottom-color:var(--gold-ink);outline:none}
input::placeholder,textarea::placeholder{color:rgba(13,27,46,.35)}
textarea{min-height:120px;resize:vertical}
.form .btn{align-self:flex-start}
.check-row{flex-direction:row;align-items:flex-start;gap:14px}
.check-row input{width:19px;height:19px;flex:0 0 auto;margin-top:4px;accent-color:var(--navy)}
.check-row label{text-transform:none;letter-spacing:0;font-size:var(--t-body);
  opacity:.9;line-height:1.6}
.form__note{grid-column:1/-1;font-size:var(--t-small);line-height:1.7;opacity:.65;margin:0}
@media(max-width:620px){
  .form{grid-template-columns:1fr;gap:20px}
  .contact{gap:32px}
}

.contact{display:flex;flex-wrap:wrap;gap:56px;margin-top:64px;padding-top:40px;
  border-top:1px solid rgba(13,27,46,.18)}
.contact div{min-width:190px}
.contact p{margin:10px 0 0;font-family:var(--display);font-size:var(--t-lead);line-height:1.35}

/* ---------- footer ---------- */
.foot{background:var(--navy-deep);color:rgba(247,244,237,.56);padding:56px 0;
  font-size:var(--t-small)}
.foot__in{display:flex;flex-wrap:wrap;gap:26px;justify-content:space-between;align-items:center}
.foot__brand{display:flex;align-items:center;gap:14px}
.foot__brand strong{font-family:var(--display);color:var(--ivory);font-size:var(--t-title);
  font-weight:400;line-height:1.2;display:block;letter-spacing:var(--track-display)}
.foot__brand small{display:block;margin-top:6px}
.foot__right{display:flex;flex-direction:column;align-items:flex-end;gap:10px;text-align:right}
.foot__verse{font-size:var(--t-micro);letter-spacing:var(--track);
  text-transform:uppercase;color:var(--gold)}
@media(max-width:620px){
  .foot__in{flex-direction:column;align-items:flex-start}
  .foot__right{align-items:flex-start;text-align:left}
}

/* ---------- motion ---------- */
.rise{opacity:0;transform:translateY(16px);transition:opacity .8s ease,transform .8s ease}
.rise.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .rise{opacity:1;transform:none;transition:none}
}

/* ============================================================
   GALLERY PAGES
   Used by grady.html and gallery.html. Same type scale and
   palette as the rest of the site — no new sizes.
   ============================================================ */

/* page header for the inner pages */
.pagehead{background:var(--navy);color:var(--ivory);text-align:center;
  padding:clamp(70px,10vw,120px) 0 clamp(50px,7vw,80px)}
.pagehead h1{font-size:var(--t-head);font-weight:400;color:var(--ivory);
  letter-spacing:var(--track-display)}
.pagehead p{margin:24px auto 0;max-width:58ch;font-size:var(--t-lead);
  color:rgba(247,244,237,.8)}
.pagehead .mono{margin:0 auto 26px}

.backlink{display:inline-block;margin-top:34px;color:var(--gold);
  text-decoration:none;font-size:var(--t-micro);letter-spacing:var(--track);
  text-transform:uppercase;border-bottom:1px solid rgba(198,161,91,.45)}
.backlink:hover{border-bottom-color:var(--gold)}

/* a titled run of photographs */
.album{padding:clamp(56px,8vw,96px) 0}
.album--dim{background:var(--ivory-dim)}
.album__head{max-width:62ch;margin-bottom:clamp(30px,4vw,44px)}
.album__head h2{font-size:var(--t-title)}
.album__head p{margin:14px 0 0;font-size:var(--t-small);line-height:1.7;opacity:.75}

/* the grid itself */
.grid{display:grid;gap:14px;
  grid-template-columns:repeat(auto-fill,minmax(265px,1fr))}
/* a section holding only a couple of pictures shouldn't leave a long
   empty shelf beside them (wide screens only — phones always use two
   columns, set further down) */
@media(min-width:621px){
  .grid:has(> :last-child:nth-child(-n+3)){
    grid-template-columns:repeat(auto-fit,minmax(265px,1fr));
    max-width:900px}
}
.shot{margin:0;position:relative;border:1px solid rgba(13,27,46,.14);
  background:var(--ivory-dim);overflow:hidden;cursor:zoom-in}
.album--dim .shot{background:var(--ivory)}
.shot img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/5;
  display:block;transition:transform .5s ease}
.shot:hover img,.shot:focus-visible img{transform:scale(1.035)}
.shot figcaption{
  position:absolute;left:0;right:0;bottom:0;margin:0;
  padding:30px 14px 12px;
  font-size:var(--t-micro);letter-spacing:var(--track);text-transform:uppercase;
  color:var(--ivory);
  background:linear-gradient(to top,rgba(6,15,28,.82),rgba(6,15,28,0));
  opacity:0;transition:opacity .3s ease;
}
.shot:hover figcaption,.shot:focus-visible figcaption{opacity:1}
.shot--wide{grid-column:span 2}
.shot--wide img{aspect-ratio:8/5}
@media(max-width:620px){
  .grid{grid-template-columns:repeat(2,1fr);gap:10px}
  .shot--wide{grid-column:span 2}
  .shot figcaption{opacity:1;font-size:var(--t-micro);padding:24px 10px 9px}
}

/* empty album — shown until photographs are added */
.album__empty{border:1px dashed rgba(13,27,46,.28);padding:clamp(34px,6vw,56px);
  text-align:center;color:rgba(13,27,46,.6);font-size:var(--t-small);line-height:1.8}
.album__empty strong{display:block;font-family:var(--display);font-size:var(--t-title);
  font-weight:400;color:var(--navy);margin-bottom:10px}

/* lightbox */
.lb{position:fixed;inset:0;z-index:200;display:none;
  background:rgba(6,15,28,.96);
  align-items:center;justify-content:center;padding:clamp(16px,4vw,56px)}
.lb.open{display:flex}
.lb__img{max-width:100%;max-height:82vh;object-fit:contain;display:block}
.lb__cap{position:absolute;left:0;right:0;bottom:clamp(18px,4vh,40px);
  text-align:center;color:rgba(247,244,237,.8);
  font-size:var(--t-micro);letter-spacing:var(--track);text-transform:uppercase}
.lb__btn{position:absolute;background:none;border:1px solid rgba(198,161,91,.4);
  color:var(--gold);width:48px;height:48px;cursor:pointer;
  font-family:var(--body);font-size:var(--t-lead);line-height:1;
  display:flex;align-items:center;justify-content:center;transition:.2s}
.lb__btn:hover{background:var(--gold);color:var(--navy-deep);border-color:var(--gold)}
.lb__close{top:clamp(14px,3vh,28px);right:clamp(14px,3vw,28px)}
.lb__prev{left:clamp(10px,2vw,28px);top:50%;transform:translateY(-50%)}
.lb__next{right:clamp(10px,2vw,28px);top:50%;transform:translateY(-50%)}
@media(max-width:620px){
  .lb__btn{width:40px;height:40px}
  .lb__img{max-height:72vh}
}

/* ---------- optional training ---------- */
.offer{margin-top:clamp(44px,6vw,64px);padding-top:clamp(34px,5vw,46px);
  border-top:1px solid rgba(13,27,46,.18)}
.offer h3{margin:0 0 14px}
.offer > p{margin:0;max-width:62ch;font-size:var(--t-body);line-height:1.75;opacity:.85}
.offer__tiers{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:clamp(20px,3vw,40px);margin-top:clamp(26px,3vw,34px)}
.offer__name{margin:0 0 8px;font-family:var(--body);font-size:var(--t-micro);
  letter-spacing:var(--track);text-transform:uppercase;color:var(--gold-ink)}
.offer__tiers p:last-child{margin:0;font-size:var(--t-body);line-height:1.75;opacity:.85}
.contact__tel{color:inherit;text-decoration:none;border-bottom:1px solid rgba(13,27,46,.25)}
.contact__tel:hover{border-bottom-color:var(--gold-ink)}

/* ============================================================
   SMALL SCREENS
   Checked at 320, 375, 390, 430, 768 and 820 px.
   ============================================================ */

/* the wordmark plus the menu button overran the narrowest phones */
.nav__brand{min-width:0}
.nav__brand span{overflow:hidden;text-overflow:ellipsis}
@media(max-width:380px){
  .nav__in{padding-inline:18px;gap:12px}
  .nav__brand{gap:9px}
  .nav__brand span{font-size:var(--t-body)}
  .mono--sm{width:28px;height:28px}
  .nav__burger{padding:6px}
}

/* A link standing on its own line needs to be big enough to hit with a
   thumb. Links inside a sentence keep their natural size, so the line
   spacing of the paragraph holds. */
@media(max-width:1024px),(hover:none){
  .backlink,.dam__more .gen__link,.ped__note .gen__link{
    display:inline-block;padding-block:12px;
  }
  .nav__brand{padding-block:8px}
  .nav__links a{padding-block:17px}
  .lb__btn{width:48px;height:48px}
}

/* the pedigree chart and the litter cards read better with a little more
   breathing room once they stack */
@media(max-width:620px){
  .cards{gap:1px}
  .card{padding:30px 24px}
  .specs li{gap:16px}
  .offer__tiers{gap:24px}
  .contact{gap:28px}
  .contact div{min-width:0}
}

@media(max-width:1024px),(hover:none){
  /* the kennel link on Brew's pedigree card, the phone number, and the
     agreement checkbox all needed a bigger target */
  .dogbox .gen__link,.contact__tel{display:inline-block;padding-block:11px}
  .check-row input{width:26px;height:26px;margin-top:0}
  .check-row{align-items:center}
}

/* ---------- what the application says back ---------- */
.form__status{grid-column:1/-1;margin:0;font-size:var(--t-small);line-height:1.7;min-height:1px}
.form__status--good{color:var(--gold-ink)}
.form__status--bad{color:#8C2F2F}

/* ---------- the sire, given his own door ---------- */
.sire{margin-top:clamp(40px,5vw,60px);padding-top:clamp(32px,4vw,44px);
  border-top:1px solid rgba(198,161,91,.3);text-align:center}
.sire__label{margin:0 0 18px;font-size:var(--t-micro);letter-spacing:var(--track);
  text-transform:uppercase;color:var(--slate)}
.sire__btn{white-space:normal}
.sire__btn svg{width:10px;height:10px;margin-left:7px;vertical-align:baseline}
.sire__sub{margin:18px 0 0;font-size:var(--t-small);line-height:1.6;color:rgba(247,244,237,.6)}