/* ══════════════════════════════════════════════════════════════════════════
   /fantasy-football-software-development — page-isolated stylesheet
   AISHTMLNEWDESIGN-346

   Visual direction: "THE DRAFT BOARD".

   This page has a constraint no sibling has: the record states that NO
   original imagery is recoverable and instructs that static graphics be used
   in every image slot, with an explicit ban on borrowing images from other
   pages. So the page ships zero <img>, and the design has to carry itself on
   type, colour and geometry alone.

   That is treated as the brief rather than a limitation. A fantasy football
   product IS a draft board, so the board becomes the page:

     · CHALK  — a static CSS grid (repeating-linear-gradient on both axes)
                laid under the hero, the two board sections and the band. It
                is the page's only texture and its whole identity. No other
                page in this batch has a visible grid.
     · PAPER  — cool white and #f5f7fb, the reading surfaces.
     · SLATE  — #1a2130, the dark bands.
     · COBALT — #1e50c8, the ONLY action colour. White on it is 6.9:1.

   Fifth distinct identity in this batch:
     -341 floodlit navy + live green    -344 aubergine ink + gold
     -342 warm bone     + oxblood       -346 chalk grid    + cobalt
     -343 pale ice/teal + coral

   Composition motif: the PICK CELL — a numbered cell on the board, carrying
   the five "why it matters" entries. The four customisation entries
   deliberately drop it for a hanging definition spread, so the page's two
   multi-item blocks never read as one repeated shape.

   Every rule is scoped to #page-fantasy-football-software-development. The UA
   body-margin reset is NOT restated here — ais-layout.css owns it.

   Design contract: rule 1 Inter · rule 2 nothing under 16px · rule 23 ·
   rule 24 image-free full-bleed hero, static gradient, 900px column ·
   rule 25 one CTA per section, unique labels · rule 26 no running animation.
   ══════════════════════════════════════════════════════════════════════════ */

#page-fantasy-football-software-development{
  --paper:#ffffff;
  --board:#f5f7fb;
  --board-2:#e8edf6;
  --line:#d6deec;
  --line-strong:#b6c2d8;
  --grid:rgba(26,33,48,.055);      /* the chalk line on light */
  --grid-d:rgba(255,255,255,.07);  /* the chalk line on slate */

  --slate:#1a2130;
  --slate-2:#242d40;
  --slate-line:rgba(255,255,255,.13);
  --on-slate:#f2f5fa;              /* 14.9:1 on slate */
  --on-slate-2:#aab6cb;            /*  7.9:1 on slate */

  --text:#131926;                  /* 16.6:1 on paper */
  --text-2:#414c60;                /*  8.5:1 on paper, 8.0:1 on board */

  --cobalt:#1e50c8;                /* white on this = 6.9:1 */
  --cobalt-d:#17409f;
  --cobalt-l:#8fb0ff;              /* on slate only */

  --r:10px;
  --r-s:5px;

  font-family:"Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  font-size:16px;
  line-height:1.6;
  color:var(--text);
  background:var(--paper);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

#page-fantasy-football-software-development a{text-decoration:none;color:inherit;}

/* BORDER-BOX — not optional. The hero is width:100% plus 24px inline padding;
   under content-box that measures viewport+48px and the document scrolls
   sideways. Found on -341 by measuring, not by reading. */
#page-fantasy-football-software-development,
#page-fantasy-football-software-development *,
#page-fantasy-football-software-development *::before,
#page-fantasy-football-software-development *::after{box-sizing:border-box;}

#page-fantasy-football-software-development :where(h1,h2,h3,h4,h5,h6,p,ul,ol,dl,dd,figure,blockquote){margin:0;}
#page-fantasy-football-software-development :where(ul,ol){padding:0;list-style:none;}
#page-fantasy-football-software-development :where(button){font:inherit;}
#page-fantasy-football-software-development :where(:focus-visible){outline:3px solid var(--cobalt);outline-offset:3px;border-radius:3px;}

/* ══ LAYOUT PRIMITIVES ═══════════════════════════════════════════════════ */
#page-fantasy-football-software-development .ffs-wrap{width:100%;max-width:1160px;margin-inline:auto;padding-inline:24px;}
#page-fantasy-football-software-development .ffs-sec{padding-block:clamp(54px,6.2vw,96px);}
#page-fantasy-football-software-development .ffs-sec--paper{background:var(--paper);}
/* THE BOARD — the page's identity. A static chalk grid; no animation, no
   url(), no image. */
#page-fantasy-football-software-development .ffs-sec--board{
  background-color:var(--board);
  background-image:
    repeating-linear-gradient(90deg,var(--grid) 0 1px,transparent 1px 64px),
    repeating-linear-gradient(0deg,var(--grid) 0 1px,transparent 1px 64px);
}

#page-fantasy-football-software-development .ffs-head{max-width:820px;margin-bottom:clamp(28px,3.2vw,46px);}
#page-fantasy-football-software-development .ffs-head--centre{margin-inline:auto;text-align:center;}

#page-fantasy-football-software-development .ffs-eyebrow{
  display:inline-block;font-size:16px;font-weight:700;letter-spacing:.15em;
  text-transform:uppercase;color:var(--cobalt);
  padding:6px 14px;border:2px solid var(--cobalt);border-radius:var(--r-s);margin-bottom:18px;
}
#page-fantasy-football-software-development .ffs-eyebrow--light{color:var(--cobalt-l);border-color:var(--cobalt-l);}

#page-fantasy-football-software-development .ffs-h2{
  font-size:clamp(28px,3.2vw,42px);line-height:1.16;font-weight:800;
  letter-spacing:-.02em;color:var(--text);
}
#page-fantasy-football-software-development .ffs-h2--light{color:var(--on-slate);}
#page-fantasy-football-software-development .ffs-h2--wide{max-width:22ch;}
#page-fantasy-football-software-development .ffs-head .ffs-h2--wide{max-width:none;}

#page-fantasy-football-software-development .ffs-link{
  color:var(--cobalt);font-weight:600;border-bottom:1px solid rgba(30,80,200,.4);
  transition:color .18s ease,border-color .18s ease;
}
#page-fantasy-football-software-development .ffs-link:hover{color:var(--cobalt-d);border-bottom-color:var(--cobalt-d);}
#page-fantasy-football-software-development .ffs-link--light{color:var(--cobalt-l);border-bottom-color:rgba(143,176,255,.45);}
#page-fantasy-football-software-development .ffs-link--light:hover{color:#c2d5ff;border-bottom-color:#c2d5ff;}

/* ══ BUTTONS ═════════════════════════════════════════════════════════════ */
#page-fantasy-football-software-development .ffs-btn{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:52px;padding:14px 30px;border-radius:var(--r-s);border:2px solid transparent;
  font-size:17px;font-weight:700;cursor:pointer;
  transition:background-color .18s ease,color .18s ease,transform .12s ease;
}
#page-fantasy-football-software-development .ffs-btn--cobalt{background:var(--cobalt);color:#ffffff;}
#page-fantasy-football-software-development .ffs-btn--cobalt:hover{background:var(--cobalt-d);}
#page-fantasy-football-software-development .ffs-btn--paper{background:#ffffff;color:var(--slate);}
#page-fantasy-football-software-development .ffs-btn--paper:hover{background:var(--cobalt-l);color:var(--slate);}
#page-fantasy-football-software-development .ffs-btn:active{transform:translateY(1px);}

#page-fantasy-football-software-development .ffs-cta-row{margin-top:clamp(28px,3.2vw,44px);display:flex;justify-content:center;}

/* ══ HERO — rule 24: full-bleed, image-free, STATIC gradient + static grid ══ */
#page-fantasy-football-software-development .ffs-hero{
  width:100%;
  padding:clamp(66px,8.2vw,120px) 24px clamp(56px,6.4vw,92px);
  background-color:var(--board);
  background-image:
    repeating-linear-gradient(90deg,var(--grid) 0 1px,transparent 1px 64px),
    repeating-linear-gradient(0deg,var(--grid) 0 1px,transparent 1px 64px),
    linear-gradient(170deg,#ffffff 0%,var(--board) 60%,var(--board-2) 100%);
  border-bottom:3px solid var(--cobalt);
}
#page-fantasy-football-software-development .ffs-hero__inner{max-width:900px;margin-inline:auto;text-align:center;}
#page-fantasy-football-software-development .ffs-hero__tag{
  display:inline-block;font-size:16px;font-weight:700;letter-spacing:.16em;
  text-transform:uppercase;color:#ffffff;background:var(--cobalt);
  padding:9px 20px;border-radius:var(--r-s);margin-bottom:24px;
}
#page-fantasy-football-software-development .ffs-hero h1{
  font-size:clamp(38px,5.2vw,64px);line-height:1.06;font-weight:900;
  letter-spacing:-.03em;color:var(--text);margin-bottom:18px;
}
#page-fantasy-football-software-development .ffs-hero__lead{
  font-size:clamp(19px,1.6vw,23px);font-weight:600;color:var(--cobalt);margin-bottom:22px;
}
#page-fantasy-football-software-development .ffs-hero__copy{
  font-size:clamp(17px,1.25vw,19px);line-height:1.72;color:var(--text-2);
  max-width:780px;margin-inline:auto;margin-bottom:34px;
}

/* ══ BREADCRUMB ══════════════════════════════════════════════════════════ */
#page-fantasy-football-software-development .ffs-crumbbar{background:var(--slate);}
#page-fantasy-football-software-development .ffs-crumb{
  display:flex;align-items:center;gap:10px;padding-block:6px;font-size:16px;color:var(--on-slate-2);
}
#page-fantasy-football-software-development .ffs-crumb svg{flex:none;color:var(--cobalt-l);}
#page-fantasy-football-software-development .ffs-crumb a{display:inline-flex;align-items:center;min-height:44px;font-weight:600;color:var(--cobalt-l);}
#page-fantasy-football-software-development .ffs-crumb a:hover{color:#c2d5ff;}
#page-fantasy-football-software-development .ffs-crumb [aria-current]{color:var(--on-slate);}

/* ══ LEDE ════════════════════════════════════════════════════════════════ */
#page-fantasy-football-software-development .ffs-lede{max-width:80ch;}
#page-fantasy-football-software-development .ffs-lede p{font-size:19px;line-height:1.78;color:var(--text-2);}
#page-fantasy-football-software-development .ffs-lede strong{font-weight:700;}

/* ══ BAND — chalk grid on slate, no background image (record forbids it) ══ */
#page-fantasy-football-software-development .ffs-band{
  padding-block:clamp(46px,5.2vw,76px);color:var(--on-slate);
  background-color:var(--slate);
  background-image:
    repeating-linear-gradient(90deg,var(--grid-d) 0 1px,transparent 1px 64px),
    repeating-linear-gradient(0deg,var(--grid-d) 0 1px,transparent 1px 64px);
}
#page-fantasy-football-software-development .ffs-band__grid{
  display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(26px,3.2vw,50px);align-items:center;
}
#page-fantasy-football-software-development .ffs-band__sub{margin-top:14px;font-size:19px;font-weight:600;color:var(--on-slate-2);}

/* ══ PICK CELLS — the page's motif ══════════════════════════════════════ */
#page-fantasy-football-software-development .ffs-picks{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2.2vw,24px);
}
#page-fantasy-football-software-development .ffs-picks li{
  position:relative;background:var(--paper);border:2px solid var(--line);
  border-radius:var(--r);padding:30px 24px 26px;
  transition:border-color .18s ease,transform .18s ease;
}
#page-fantasy-football-software-development .ffs-picks li:hover{border-color:var(--cobalt);transform:translateY(-4px);}
/* the pick number sits on the cell's top edge, the way a board is numbered */
#page-fantasy-football-software-development .ffs-pick__n{
  position:absolute;top:-15px;left:22px;
  display:inline-flex;align-items:center;justify-content:center;
  min-width:44px;height:28px;padding:0 10px;border-radius:var(--r-s);
  font-size:16px;font-weight:800;font-variant-numeric:tabular-nums;
  background:var(--cobalt);color:#ffffff;
}
#page-fantasy-football-software-development .ffs-picks h3{font-size:20px;font-weight:700;line-height:1.3;color:var(--text);margin-bottom:10px;}
#page-fantasy-football-software-development .ffs-picks p{font-size:17px;line-height:1.68;color:var(--text-2);}
#page-fantasy-football-software-development .ffs-picks strong{font-weight:700;}

/* ══ HANGING SPREAD — the second multi-item block ═══════════════════════ */
#page-fantasy-football-software-development .ffs-hang dt{
  font-size:22px;font-weight:700;line-height:1.3;color:var(--text);
  padding-top:24px;border-top:3px solid var(--cobalt);
}
#page-fantasy-football-software-development .ffs-hang dt + dd{
  margin:12px 0 32px;font-size:17px;line-height:1.74;color:var(--text-2);max-width:76ch;
}
#page-fantasy-football-software-development .ffs-hang dd:last-child{margin-bottom:0;}
#page-fantasy-football-software-development .ffs-hang strong{font-weight:700;}

/* ══ CLOSING CTA BAND ═══════════════════════════════════════════════════ */
#page-fantasy-football-software-development .ffs-cta{
  padding-block:clamp(56px,6.6vw,100px);color:var(--on-slate);
  background-color:var(--slate-2);
  background-image:
    repeating-linear-gradient(90deg,var(--grid-d) 0 1px,transparent 1px 64px),
    repeating-linear-gradient(0deg,var(--grid-d) 0 1px,transparent 1px 64px);
}
#page-fantasy-football-software-development .ffs-cta__inner{max-width:840px;text-align:center;margin-inline:auto;}
#page-fantasy-football-software-development .ffs-cta__copy{margin-top:22px;font-size:19px;line-height:1.7;color:var(--on-slate-2);}
#page-fantasy-football-software-development .ffs-aside{margin-top:20px;font-size:17px;color:var(--on-slate-2);}

/* ══ PROSE ══════════════════════════════════════════════════════════════ */
#page-fantasy-football-software-development .ffs-prose{max-width:80ch;}
#page-fantasy-football-software-development .ffs-prose p{font-size:17px;line-height:1.78;color:var(--text-2);}
#page-fantasy-football-software-development .ffs-prose p + p{margin-top:18px;}
#page-fantasy-football-software-development .ffs-prose strong{font-weight:700;}

/* ══ FAQ ════════════════════════════════════════════════════════════════ */
#page-fantasy-football-software-development .ffs-faq{max-width:900px;margin-inline:auto;border-top:1px solid var(--line-strong);}
#page-fantasy-football-software-development .ffs-faq details{border-bottom:1px solid var(--line-strong);}
#page-fantasy-football-software-development .ffs-faq summary{
  display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:16px;align-items:center;
  padding:22px 4px;cursor:pointer;list-style:none;
}
#page-fantasy-football-software-development .ffs-faq summary::-webkit-details-marker{display:none;}
#page-fantasy-football-software-development .ffs-faq summary h2{font-size:19px;font-weight:700;line-height:1.4;color:var(--text);transition:color .18s ease;}
#page-fantasy-football-software-development .ffs-faq summary:hover h2{color:var(--cobalt);}
#page-fantasy-football-software-development .ffs-faq__n{font-size:16px;font-weight:800;color:var(--cobalt);font-variant-numeric:tabular-nums;min-width:36px;}
#page-fantasy-football-software-development .ffs-faq__pm{position:relative;width:20px;height:20px;flex:none;}
#page-fantasy-football-software-development .ffs-faq__pm::before,
#page-fantasy-football-software-development .ffs-faq__pm::after{
  content:"";position:absolute;left:50%;top:50%;background:var(--cobalt);
  transform:translate(-50%,-50%);transition:opacity .18s ease;
}
#page-fantasy-football-software-development .ffs-faq__pm::before{width:16px;height:2px;}
#page-fantasy-football-software-development .ffs-faq__pm::after{width:2px;height:16px;}
#page-fantasy-football-software-development .ffs-faq details[open] .ffs-faq__pm::after{opacity:0;}
#page-fantasy-football-software-development .ffs-faq__a{display:grid;grid-template-columns:auto minmax(0,1fr);gap:16px;padding:0 4px 24px 4px;}
#page-fantasy-football-software-development .ffs-faq__ans{font-size:16px;font-weight:800;color:var(--text-2);min-width:36px;}
#page-fantasy-football-software-development .ffs-faq__a p{font-size:17px;line-height:1.72;color:var(--text-2);}
#page-fantasy-football-software-development .ffs-steps{margin-top:12px;display:grid;gap:10px;}
#page-fantasy-football-software-development .ffs-steps li{
  position:relative;padding-left:26px;font-size:17px;line-height:1.7;color:var(--text-2);
}
#page-fantasy-football-software-development .ffs-steps li::before{
  content:"";position:absolute;left:0;top:.62em;width:10px;height:10px;
  background:var(--cobalt);border-radius:2px;
}

/* ══ STORIES — quote cards, NO thumbnails (record forbids borrowed imagery) ══ */
#page-fantasy-football-software-development .ffs-stories{
  padding-block:clamp(52px,6.2vw,94px);color:var(--on-slate-2);
  background-color:var(--slate);
  background-image:
    repeating-linear-gradient(90deg,var(--grid-d) 0 1px,transparent 1px 64px),
    repeating-linear-gradient(0deg,var(--grid-d) 0 1px,transparent 1px 64px);
}
#page-fantasy-football-software-development .ffs-storylist{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,2.4vw,28px);}
#page-fantasy-football-software-development .ffs-story{
  display:flex;flex-direction:column;justify-content:space-between;gap:20px;
  background:var(--slate-2);border:1px solid var(--slate-line);border-radius:var(--r);
  padding:28px 26px;border-top:3px solid var(--cobalt-l);
}
#page-fantasy-football-software-development .ffs-story blockquote p{font-size:17px;line-height:1.7;color:var(--on-slate-2);}
#page-fantasy-football-software-development .ffs-vid{
  display:inline-flex;align-items:center;gap:12px;align-self:flex-start;
  min-height:48px;padding:10px 20px 10px 12px;border-radius:999px;
  border:1px solid var(--slate-line);background:transparent;color:var(--on-slate);
  font-size:16px;font-weight:600;cursor:pointer;
  transition:background-color .18s ease,border-color .18s ease;
}
#page-fantasy-football-software-development .ffs-vid:hover{background:rgba(255,255,255,.06);border-color:var(--cobalt-l);}
#page-fantasy-football-software-development .ffs-vid__play{
  display:flex;align-items:center;justify-content:center;flex:none;
  width:32px;height:32px;border-radius:50%;background:var(--cobalt);color:#ffffff;padding-left:3px;
}
#page-fantasy-football-software-development .ffs-story__frame{width:100%;aspect-ratio:16/9;border:0;display:block;border-radius:var(--r-s);}
#page-fantasy-football-software-development .ffs-more{margin-top:30px;text-align:center;font-size:17px;font-weight:600;}

/* ══ AREA WE SERVE ══════════════════════════════════════════════════════ */
#page-fantasy-football-software-development .ffs-regions{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(18px,2.4vw,26px);}
#page-fantasy-football-software-development .ffs-region{
  background:var(--board);border:1px solid var(--line);border-radius:var(--r);
  padding:24px 22px;border-top:3px solid var(--cobalt);
}
#page-fantasy-football-software-development .ffs-region h3{
  display:flex;align-items:center;gap:10px;
  font-size:17px;font-weight:800;letter-spacing:.08em;color:var(--text);margin-bottom:10px;
}
#page-fantasy-football-software-development .ffs-region h3 svg{flex:none;color:var(--cobalt);}
/* A tel: link is the most-tapped control here on a phone — a real target. */
#page-fantasy-football-software-development .ffs-tel{
  display:inline-flex;align-items:center;min-height:44px;
  font-size:17px;font-weight:700;color:var(--cobalt);margin-bottom:4px;
}
#page-fantasy-football-software-development .ffs-tel:hover{color:var(--cobalt-d);}
#page-fantasy-football-software-development .ffs-region p{font-size:16px;line-height:1.62;color:var(--text-2);}

/* ══ CTA MODAL ══════════════════════════════════════════════════════════ */
#page-fantasy-football-software-development .ffs-modal{display:none;position:fixed;inset:0;z-index:9999;padding:20px;overflow-y:auto;background:rgba(10,14,22,.76);}
#page-fantasy-football-software-development .ffs-modal.is-open{display:flex;align-items:flex-start;justify-content:center;}
#page-fantasy-football-software-development .ffs-modal__box{
  position:relative;width:100%;max-width:640px;margin:auto;background:#ffffff;
  border-radius:14px;overflow:hidden;box-shadow:0 30px 70px rgba(0,0,0,.45);
}
#page-fantasy-football-software-development .ffs-modal__x{
  position:absolute;top:12px;right:12px;z-index:2;width:38px;height:38px;border-radius:50%;
  border:1px solid var(--line);background:#ffffff;color:var(--text);cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  transition:background-color .18s ease,color .18s ease,border-color .18s ease;
}
#page-fantasy-football-software-development .ffs-modal__x:hover{background:var(--cobalt);color:#ffffff;border-color:var(--cobalt);}
/* Skill rule 20 — the GHL widget is a TWO-SLIDE survey whose slides differ in
   height and it never posts its own height, so any FIXED height either wastes
   space under slide 1 or clips slide 2's SUBMIT bar. form_embed.js sizes per
   slide and loads on first modal open; until it initialises the iframe keeps a
   floor tall enough for the WORST slide and drops the negative margin. */
#page-fantasy-football-software-development .ffs-modal iframe{display:block;width:100%;border:0;margin-bottom:-5px;}
#page-fantasy-football-software-development .ffs-modal iframe:not([data-iframe-resizer-initialized]){min-height:1290px;margin-bottom:0;}

/* ══ RESPONSIVE ═════════════════════════════════════════════════════════ */
@media (max-width:1000px){
  #page-fantasy-football-software-development .ffs-picks{grid-template-columns:repeat(2,minmax(0,1fr));}
  #page-fantasy-football-software-development .ffs-regions{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:900px){
  #page-fantasy-football-software-development .ffs-band__grid{grid-template-columns:minmax(0,1fr);}
  #page-fantasy-football-software-development .ffs-storylist{grid-template-columns:minmax(0,1fr);}
  #page-fantasy-football-software-development .ffs-h2--wide{max-width:none;}
}
@media (max-width:640px){
  #page-fantasy-football-software-development .ffs-wrap{padding-inline:18px;}
  #page-fantasy-football-software-development .ffs-hero{padding-inline:18px;}
  #page-fantasy-football-software-development .ffs-picks{grid-template-columns:minmax(0,1fr);}
  #page-fantasy-football-software-development .ffs-regions{grid-template-columns:minmax(0,1fr);}
  #page-fantasy-football-software-development .ffs-btn{width:100%;}
  #page-fantasy-football-software-development .ffs-cta-row{justify-content:stretch;}
}

/* Rule 26 — the transitions above are this page's ONLY motion, each a finite
   response to hover, focus, press or details-open. No @keyframes in this file. */
@media (prefers-reduced-motion:reduce){
  #page-fantasy-football-software-development *,
  #page-fantasy-football-software-development *::before,
  #page-fantasy-football-software-development *::after{transition-duration:.01ms !important;animation:none !important;}
}
