/* =========================================================
   Prime Estimation — service page layer
   Loads after style.css and reuses its tokens, header,
   footer, timeline, FAQ and CTA. Only page-specific
   blocks live here.

   1. Page hero + breadcrumb
   2. Sticky section nav
   3. Deliverables table
   4. Scope cards
   5. Tool cards
   6. Turnaround + pricing
   7. Feature block (per-page section)
   8. Audience cards
   9. Sample line items table
   10. Responsive
   ========================================================= */

/* ---------- 1. Page hero ---------- */
.page-hero{
  position:relative;overflow:hidden;color:rgba(255,255,255,.76);
  background:linear-gradient(115deg,var(--navy) 0%,var(--navy-deep) 58%,#0B3E39 100%);
  padding:44px 0 72px;
}
.page-hero::after{
  content:"";position:absolute;right:-8%;top:-30%;width:42%;height:160%;
  background:linear-gradient(180deg,rgba(20,116,106,.3),rgba(20,116,106,0));
  transform:skewX(-14deg);
}
.page-hero-lines{
  position:absolute;inset:0;pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);
  background-size:56px 56px;
  -webkit-mask-image:linear-gradient(100deg,#000,transparent 72%);
  mask-image:linear-gradient(100deg,#000,transparent 72%);
}

.crumbs{
  position:relative;z-index:2;display:flex;flex-wrap:wrap;align-items:center;gap:8px;
  margin:0 0 26px;font-size:var(--fs-sm);color:rgba(255,255,255,.5);
}
.crumbs a{color:rgba(255,255,255,.72)}
.crumbs a:hover{color:var(--teal-bright)}
.crumbs span{opacity:.45}
.crumbs [aria-current]{color:#fff}

.page-hero-grid{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:56px;align-items:stretch}
.page-hero h1{color:#fff;margin-bottom:14px}
.page-hero-sub{
  font-family:var(--ff-head);font-size:1.05rem;font-weight:500;color:var(--teal-bright);
  margin-bottom:20px;line-height:1.45;
}
.page-hero p{font-size:var(--fs-lead)}
.page-hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}

.hero-figure{position:relative;display:flex;margin:0}
.hero-figure img{
  width:100%;flex:1;min-height:360px;object-fit:cover;
  border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);
}
.figure-badge{
  position:absolute;left:-18px;bottom:22px;display:flex;align-items:center;gap:12px;
  background:#fff;border-radius:12px;padding:14px 18px;box-shadow:var(--shadow-lg);
}
.figure-badge svg{width:20px;height:20px;color:var(--teal)}
.figure-badge b{display:block;font-family:var(--ff-head);font-size:.95rem;color:var(--heading);line-height:1.2}
.figure-badge small{font-size:var(--fs-xs);color:var(--muted)}

.hero-facts{
  position:relative;z-index:2;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;
  margin-top:48px;background:rgba(255,255,255,.1);border-radius:var(--radius);overflow:hidden;
}
.hero-facts div{background:rgba(6,20,42,.55);padding:20px 22px}
.hero-facts b{
  display:block;font-family:var(--ff-head);font-size:1.15rem;font-weight:700;color:#fff;line-height:1.2;
}
.hero-facts small{display:block;font-size:var(--fs-xs);color:rgba(255,255,255,.55);margin-top:3px}

/* ---------- 2. Sticky section nav ---------- */
.sec-nav{
  position:sticky;top:98px;z-index:40;background:rgba(255,255,255,.96);
  border-bottom:1px solid var(--line);backdrop-filter:blur(10px);
}
.sec-nav ul{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding:6px 0}
.sec-nav ul::-webkit-scrollbar{display:none}
.sec-nav a{
  display:block;white-space:nowrap;padding:12px 16px;border-radius:9px;
  font-family:var(--ff-head);font-size:var(--fs-sm);font-weight:500;color:var(--heading);
}
.sec-nav a:hover{background:var(--bg-soft);color:var(--teal)}
.sec-nav a.active{background:var(--tint);color:var(--teal-dark);font-weight:600}

/* ---------- 3. Tables ---------- */
.table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--radius);background:#fff}
table.data{width:100%;border-collapse:collapse;min-width:620px}
table.data thead th{
  text-align:left;padding:16px 22px;background:var(--navy);color:#fff;
  font-family:var(--ff-head);font-size:var(--fs-xs);font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;
}
table.data tbody td{padding:15px 22px;border-top:1px solid var(--line);font-size:var(--fs-sm);vertical-align:top}
table.data tbody tr:nth-child(even){background:var(--bg-soft)}
table.data tbody tr:hover{background:var(--tint)}
table.data td:first-child{font-family:var(--ff-head);font-weight:600;color:var(--heading)}
.fmt-badge{
  display:inline-block;padding:4px 11px;border-radius:999px;background:var(--tint);
  color:var(--teal-dark);font-family:var(--ff-head);font-size:var(--fs-xs);font-weight:600;white-space:nowrap;
}
.table-foot{margin:18px 0 0;font-size:var(--fs-sm);color:var(--muted);text-align:center}

/* numeric sample table */
table.data.numeric td:nth-child(n+2){font-variant-numeric:tabular-nums}
table.data.numeric td:nth-child(2),table.data.numeric td:nth-child(3),
table.data.numeric td:nth-child(4),table.data.numeric td:nth-child(5),table.data.numeric td:nth-child(6){text-align:right}
table.data.numeric thead th:nth-child(n+2){text-align:right}
.cell-qty{font-family:var(--ff-head);font-weight:600;color:var(--heading)}
.cell-blank{color:#B6C4CE}
/* two-up reference table: column 4 restarts the pairing, so it reads as a label again */
table.data.two-up td:nth-child(4),table.data.two-up thead th:nth-child(4){
  text-align:left;font-family:var(--ff-head);font-weight:600;color:var(--heading);
  border-left:1px solid var(--line);
}
table.data.two-up thead th:nth-child(4){color:#fff;border-left-color:rgba(255,255,255,.18)}

/* ---------- 4. Scope cards ---------- */
/* rows size to their own content; cards inside a row still stretch to match each other,
   so nothing is ragged and a short 7th card does not inherit a tall row */
.scope-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:auto;gap:var(--gap)}
.scope-card{
  position:relative;overflow:hidden;display:flex;flex-direction:column;
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:var(--card-pad);
  transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease;
}
.scope-card::after{
  content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--teal);
  border-radius:var(--radius) var(--radius) 0 0;transform:scaleX(0);transform-origin:left;transition:transform .35s ease;
}
.scope-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-md);border-color:rgba(20,116,106,.28)}
.scope-card:hover::after{transform:scaleX(1)}
.scope-head{display:flex;align-items:center;gap:14px;padding-bottom:16px;margin-bottom:18px;border-bottom:1px solid var(--line)}
.scope-head h3{margin:0}
.scope-ico{
  width:48px;height:48px;border-radius:12px;background:var(--tint);color:var(--teal);
  display:grid;place-items:center;flex-shrink:0;transition:all .3s ease;
}
.scope-ico svg{width:22px;height:22px}
.scope-card:hover .scope-ico{background:var(--teal);color:#fff}
.scope-card ul{display:flex;flex-wrap:wrap;align-content:flex-start;gap:8px}
.scope-card li{
  padding:6px 13px;background:var(--bg-soft);border:1px solid var(--line);border-radius:999px;
  font-size:var(--fs-sm);line-height:1.5;color:var(--heading);
}
.scope-card:hover li{background:#fff;border-color:rgba(20,116,106,.2)}
/* a 7th card would sit alone on its row, so it runs full width and lays out sideways */
.scope-card:last-child:nth-child(3n+1){
  grid-column:1 / -1;display:grid;grid-template-columns:330px minmax(0,1fr);
  gap:30px;align-items:center;
}
.scope-card:last-child:nth-child(3n+1) .scope-head{
  margin:0;padding:0 30px 0 0;border-bottom:none;border-right:1px solid var(--line);
}
.scope-card:last-child:nth-child(3n+1) p{margin:0}

/* ---------- 5. Tool cards ---------- */
.tool-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:1fr;gap:var(--gap)}
.tool-card{
  display:flex;flex-direction:column;gap:16px;background:#fff;border:1px solid var(--line);
  border-radius:var(--radius);padding:24px 26px;transition:all .3s ease;
}
.tool-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-md);border-color:rgba(20,116,106,.28)}
.tool-logo{height:42px;display:flex;align-items:center}
.tool-logo img{max-height:42px;max-width:160px;width:auto;object-fit:contain;filter:grayscale(1);opacity:.65;transition:all .3s ease}
.tool-card:hover .tool-logo img{filter:none;opacity:1}
.tool-name{
  font-family:var(--ff-head);font-size:.95rem;font-weight:600;color:var(--heading);
  margin:0;padding-top:14px;border-top:1px solid var(--line);
}
.tool-card p{margin:6px 0 0;font-size:var(--fs-sm)}
.tool-foot{margin:26px 0 0;text-align:center;font-size:var(--fs-lead);color:var(--heading)}

/* ---------- 6. Turnaround + pricing ---------- */
.turn-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:1fr;gap:var(--gap)}
.turn-card{
  display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);
  border-radius:var(--radius);padding:28px 24px;transition:all .3s ease;
}
.turn-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-md);border-color:rgba(20,116,106,.28)}
.turn-ico{
  width:48px;height:48px;border-radius:12px;background:var(--tint);color:var(--teal);
  display:grid;place-items:center;margin-bottom:16px;transition:all .3s ease;
}
.turn-ico svg{width:22px;height:22px}
.turn-card:hover .turn-ico{background:var(--teal);color:#fff}
.turn-card h3{font-size:1rem;margin-bottom:12px;min-height:2.56em}
.turn-time{
  display:inline-flex;align-items:center;gap:7px;align-self:flex-start;margin-bottom:14px;
  padding:5px 12px;border-radius:999px;background:var(--navy);color:#fff;
  font-family:var(--ff-head);font-size:var(--fs-xs);font-weight:600;
}
.turn-time svg{width:13px;height:13px}
.turn-fee{margin:auto 0 0;padding-top:14px;border-top:1px solid var(--line);font-size:var(--fs-sm);color:var(--muted)}

/* ---------- 7. Feature block ---------- */
.feature-block{
  position:relative;overflow:hidden;color:rgba(255,255,255,.76);
  background:linear-gradient(115deg,var(--navy) 0%,var(--navy-deep) 60%,#0B3E39 100%);
}
.feature-block .container{position:relative;z-index:2}
.feature-block h2{color:#fff}
.feature-block .sec-sub{color:rgba(255,255,255,.72)}
.feature-block .sec-head{margin-bottom:40px}
.fb-media{position:absolute;inset:0;opacity:.13}
.fb-media img{width:100%;height:100%;object-fit:cover;filter:grayscale(1)}
.fb-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:1fr;gap:var(--gap)}
.fb-card{
  display:flex;flex-direction:column;background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.12);border-radius:var(--radius);padding:26px 24px;
  transition:all .3s ease;
}
.fb-card:hover{background:rgba(255,255,255,.09);transform:translateY(-5px)}
.fb-ico{
  width:46px;height:46px;border-radius:12px;background:rgba(67,175,150,.18);color:var(--teal-bright);
  display:grid;place-items:center;margin-bottom:16px;
}
.fb-ico svg{width:21px;height:21px}
.fb-card h3{color:#fff;margin-bottom:9px}
.fb-card p{margin:0;font-size:var(--fs-sm);color:rgba(255,255,255,.66)}

/* missed-items list (masonry) */
.missed-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.missed-item{
  display:flex;gap:14px;align-items:flex-start;background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:18px 20px;transition:all .3s ease;
}
.missed-item:hover{background:rgba(255,255,255,.09)}
.missed-ico{
  width:34px;height:34px;border-radius:9px;background:rgba(67,175,150,.18);color:var(--teal-bright);
  display:grid;place-items:center;flex-shrink:0;
}
.missed-ico svg{width:17px;height:17px}
.missed-item h4{color:#fff;margin:0 0 4px;font-size:.92rem}
.missed-item p{margin:0;font-size:var(--fs-sm);color:rgba(255,255,255,.62)}

/* ---------- 8. Audience cards ---------- */
.aud-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:1fr;gap:var(--gap)}
.aud-card{
  display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);
  border-radius:var(--radius);padding:24px 22px;transition:all .3s ease;
}
.aud-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-md);border-color:rgba(20,116,106,.28)}
.aud-ico{
  width:42px;height:42px;border-radius:11px;background:var(--tint);color:var(--teal);
  display:grid;place-items:center;margin-bottom:14px;flex-shrink:0;transition:all .3s ease;
}
.aud-ico svg{width:20px;height:20px}
.aud-card:hover .aud-ico{background:var(--teal);color:#fff}
.aud-card h3{font-size:.95rem;margin-bottom:8px}
.aud-card p{margin:0;font-size:var(--fs-sm)}

/* ---------- 9. Split block ---------- */
.split-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:stretch}
.split-media{position:relative;display:flex}
.split-media img{
  width:100%;flex:1;min-height:380px;object-fit:cover;
  border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);
}
.split-copy{display:flex;flex-direction:column;justify-content:center}
.split-list{display:grid;gap:12px;margin-top:22px}
.split-list li{
  display:flex;gap:13px;align-items:flex-start;background:#fff;border:1px solid var(--line);
  border-radius:12px;padding:16px 18px;transition:all .28s ease;font-size:var(--fs-sm);
}
.split-list li:hover{border-color:rgba(20,116,106,.28);box-shadow:var(--shadow-sm);transform:translateX(3px)}
.split-list svg{width:18px;height:18px;color:var(--teal);flex-shrink:0;margin-top:3px}
.split-list strong{color:var(--heading);font-family:var(--ff-head);font-weight:600}

/* ---------- 10. Responsive ---------- */
@media (max-width:1180px){
  .scope-grid,.tool-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .turn-grid,.aud-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fb-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:1024px){
  .page-hero{padding:34px 0 56px}
  .page-hero-grid,.split-grid{grid-template-columns:minmax(0,1fr);gap:36px}
  .hero-figure img{min-height:280px}
  .figure-badge{left:16px;bottom:16px}
  .hero-facts{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:34px}
  .sec-nav{top:98px}
  .missed-list{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:860px){
  .scope-grid,.tool-grid,.turn-grid,.aud-grid,.fb-grid{grid-template-columns:minmax(0,1fr);grid-auto-rows:auto}
  .split-media img{min-height:260px}
  .scope-card:last-child:nth-child(3n+1){grid-template-columns:minmax(0,1fr);gap:0;display:flex;flex-direction:column}
  .scope-card:last-child:nth-child(3n+1) .scope-head{
    padding:0 0 16px;margin-bottom:18px;border-right:none;border-bottom:1px solid var(--line);
  }
}
@media (max-width:640px){
  .hero-facts{grid-template-columns:minmax(0,1fr)}
  .page-hero-actions .btn{flex:1 1 auto}
  .sec-nav{top:80px}
  .sec-nav a{padding:11px 13px}
}