@charset "UTF-8";
/* =============================================================
   ウェブナラ！ 営業資料  —  style.css
   Design system: teal-forward, disciplined yellow accent.
   ============================================================= */

/* ---------- Fonts ---------- */
@import url('https://fonts.googleapis.com/css2?family=Zen+Kaku+Gothic+New:wght@500;700;900&family=Noto+Sans+JP:wght@400;500;700&family=Manrope:wght@500;600;700;800&display=swap');

/* ---------- Design tokens ---------- */
:root{
  /* palette */
  --paper:#fbfdfc;        /* warm-cool near white base            */
  --mist:#eef3f2;         /* light gray-teal panel                */
  --mist-2:#e3ecea;       /* slightly deeper panel/border         */
  --teal:#178782;         /* brand primary (logo / CTA)           */
  --teal-deep:#0f5c58;    /* deep teal — heading emphasis         */
  --teal-ink:#0b3f3c;     /* darkest teal — for teal panels text  */
  --ink:#17211f;          /* near-black charcoal text             */
  --muted:#5c6a67;        /* secondary text                       */
  --line:#d7e0de;         /* hairline border                      */
  --sun:#ffc400;          /* yellow accent (used sparingly)       */
  --sun-soft:#fff6d6;     /* pale yellow wash                     */
  --sun-deep:#a8760a;     /* text on yellow                       */

  /* type */
  --f-display:"Zen Kaku Gothic New","Noto Sans JP",sans-serif;
  --f-body:"Noto Sans JP",sans-serif;
  --f-num:"Manrope","Noto Sans JP",sans-serif;

  /* page geometry (A4 landscape @96dpi) */
  --pw:1122px;
  --ph:793px;
  --pad:56px;

  --radius:14px;
  --shadow:0 1px 2px rgba(11,63,60,.04), 0 12px 32px rgba(11,63,60,.06);
}

/* ---------- Reset-ish ---------- */
*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{
  margin:0;
  font-family:var(--f-body);
  color:var(--ink);
  background:#c9d4d2;
  line-height:1.7;
  font-feature-settings:"palt" 1;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
h1,h2,h3,h4,p,ul,ol,figure{margin:0;padding:0;}
ul,ol{list-style:none;}
img{display:block;max-width:100%;}
strong{font-weight:700;}
b{font-weight:700;}

/* =============================================================
   Page shell — each .page is one A4-landscape slide
   ============================================================= */
.deck{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:26px;
  padding:40px 20px 80px;
}
.page{
  position:relative;
  width:var(--pw);
  height:var(--ph);
  background:var(--paper);
  overflow:hidden;
  box-shadow:0 18px 50px rgba(11,63,60,.16);
  padding:var(--pad) var(--pad) 46px calc(var(--pad) + 46px);
  display:flex;
  flex-direction:column;
}
.page--dark{background:var(--teal-deep);color:#eafaf8;}
.page--tint{background:linear-gradient(160deg,#f4f9f8 0%,#eef3f2 100%);}

/* ---------- signature spine (left edge) ---------- */
.spine{
  position:absolute;
  left:0; top:0; bottom:0;
  width:46px;
  background:var(--teal);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:space-between;
  padding:22px 0;
  color:#dff5f2;
}
.page--dark .spine{background:rgba(255,255,255,.10);}
.spine__label{
  writing-mode:vertical-rl;
  font-family:var(--f-num);
  font-weight:700;
  font-size:11px;
  letter-spacing:.28em;
  text-transform:uppercase;
  color:#eafaf8;
  opacity:.92;
}
.spine__num{
  font-family:var(--f-num);
  font-weight:800;
  font-size:15px;
  letter-spacing:.04em;
  writing-mode:vertical-rl;
}
.spine__dot{width:6px;height:6px;border-radius:50%;background:var(--sun);}

/* ---------- page header ---------- */
.eyebrow{
  display:inline-flex;align-items:center;gap:9px;
  font-family:var(--f-num);
  font-weight:700;
  font-size:12px;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--teal);
}
.eyebrow::before{content:"";width:22px;height:2px;background:var(--sun);border-radius:2px;}
.page--dark .eyebrow{color:#7fe3db;}

.p-title{
  font-family:var(--f-display);
  font-weight:900;
  font-size:34px;
  line-height:1.28;
  letter-spacing:.01em;
  color:var(--ink);
  margin-top:12px;
}
.page--dark .p-title{color:#fff;}
.p-title .hl{color:var(--teal);}
.p-title .u{
  background:linear-gradient(transparent 64%, var(--sun-soft) 64%);
  padding:0 .05em;
}
.p-lead{
  font-size:15px;
  color:var(--muted);
  margin-top:14px;
  max-width:760px;
}
.page--dark .p-lead{color:#bfe9e4;}

.page__foot{
  margin-top:auto;
  display:flex;justify-content:space-between;align-items:center;
  padding-top:14px;
  font-size:11px;color:#9aa8a5;
  font-family:var(--f-num);letter-spacing:.04em;
}
.page__foot .wm{display:flex;align-items:center;gap:7px;font-weight:700;color:var(--teal-deep);}
.page__foot .wm img{height:15px;width:auto;}
.page--dark .page__foot{color:#7fb8b3;}
.page--dark .page__foot .wm{color:#bff2ec;}

/* =============================================================
   Reusable atoms
   ============================================================= */
.pill{
  display:inline-flex;align-items:center;gap:7px;
  font-size:12px;font-weight:700;
  padding:5px 12px;border-radius:999px;
  background:var(--mist);color:var(--teal-deep);
  border:1px solid var(--line);
}
.pill--sun{background:var(--sun-soft);color:var(--sun-deep);border-color:#f2e3a8;}
.pill--teal{background:var(--teal);color:#fff;border-color:var(--teal);}

.chk{position:relative;padding-left:26px;}
.chk::before{
  content:"";position:absolute;left:0;top:.28em;
  width:16px;height:16px;border-radius:50%;
  background:var(--teal);
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='white' d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/></svg>") center/12px no-repeat;
          mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='white' d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/></svg>") center/12px no-repeat;
  background-color:var(--teal);
}

/* icon chip */
.ichip{
  width:44px;height:44px;flex:0 0 44px;border-radius:12px;
  background:var(--mist);
  display:flex;align-items:center;justify-content:center;
}
.ichip svg{width:24px;height:24px;stroke:var(--teal);stroke-width:1.7;fill:none;stroke-linecap:round;stroke-linejoin:round;}
.ichip img{width:26px;height:26px;object-fit:contain;}
.ichip--sun{background:var(--sun-soft);}
.ichip--sun svg{stroke:var(--sun-deep);}

/* =============================================================
   01 — Cover
   ============================================================= */
.cover{
  padding:0;
  background:
     radial-gradient(120% 90% at 88% 8%, #1f9a94 0%, rgba(31,154,148,0) 55%),
     radial-gradient(120% 100% at 0% 100%, #0c4b48 0%, rgba(12,75,72,0) 50%),
     var(--teal-deep);
  color:#eafaf8;
}
.cover .spine{background:rgba(255,255,255,.10);}
.cover__grid{
  position:relative;z-index:2;
  height:100%;
  display:grid;grid-template-columns:minmax(0,1fr) 430px;
}
.cover__left{padding:60px 40px 50px 88px;display:flex;flex-direction:column;min-width:0;}
.cover__brand{display:flex;align-items:center;gap:14px;}
.cover__brand img{height:46px;width:auto;filter:drop-shadow(0 4px 10px rgba(0,0,0,.25));}
.cover__brand .nm{font-family:var(--f-display);font-weight:900;font-size:26px;color:#fff;letter-spacing:.02em;}
.cover__ey{
  margin-top:54px;font-family:var(--f-num);font-weight:700;font-size:13px;
  letter-spacing:.26em;text-transform:uppercase;color:#8fe6de;
}
.cover h1{
  font-family:var(--f-display);font-weight:900;
  font-size:45px;line-height:1.34;letter-spacing:-.01em;color:#fff;
  margin-top:18px;white-space:nowrap;
}
.cover h1 .sun{color:var(--sun);}
.cover__sub{margin-top:20px;font-size:14px;line-height:1.85;color:#cdeeea;max-width:500px;}
.cover__sub-lead{display:block;font-size:18px;font-weight:700;color:var(--sun);margin-bottom:9px;letter-spacing:.01em;}
.cover__meta{margin-top:auto;display:flex;gap:10px;flex-wrap:wrap;}
.cover__meta .pill{background:rgba(255,255,255,.12);color:#eafaf8;border-color:rgba(255,255,255,.22);}
.cover__meta .pill b{color:var(--sun);}

.cover__right{position:relative;overflow:visible;}
/* portfolio stack — real works images tilted into a fan (floating cards, no clip line) */
.cover-works{position:absolute;inset:0;}
.cw{
  position:absolute;margin:0;overflow:hidden;border-radius:14px;
  border:4px solid #fff;
  box-shadow:0 22px 46px rgba(0,0,0,.42);
  background:#fff;
}
.cw img{display:block;width:100%;height:100%;object-fit:cover;object-position:center;}
.cw--1{width:302px;height:218px;top:52px;right:56px;transform:rotate(-5deg);z-index:3;}
.cw--2{width:330px;height:238px;top:250px;right:10px;transform:rotate(3deg);z-index:2;}
.cw--3{width:286px;height:206px;top:452px;right:82px;transform:rotate(-3deg);z-index:1;}
.cw-badge{
  position:absolute;z-index:4;top:40px;right:24px;
  background:var(--sun);color:#2a2100;font-weight:800;font-size:12px;
  padding:7px 15px;border-radius:999px;letter-spacing:.05em;
  box-shadow:0 8px 20px rgba(0,0,0,.28);transform:rotate(3deg);
}

/* =============================================================
   Generic layout helpers
   ============================================================= */
.body-wrap{flex:1;min-height:0;display:flex;flex-direction:column;}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.mt-a{margin-top:auto;}

/* card */
.card{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:20px 22px;box-shadow:var(--shadow);
}
.card__h{font-family:var(--f-display);font-weight:700;font-size:16px;color:var(--ink);}
.card__t{font-size:13px;color:var(--muted);margin-top:7px;line-height:1.75;}

/* =============================================================
   02 — Problems
   ============================================================= */
.prob-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:26px;
}
.prob{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:20px;position:relative;box-shadow:var(--shadow);
  display:flex;flex-direction:column;gap:12px;
}
.prob__q{
  font-family:var(--f-num);font-weight:800;font-size:26px;color:var(--mist-2);
  position:absolute;top:14px;right:18px;line-height:1;
}
.prob__ic{width:56px;height:56px;display:flex;align-items:center;justify-content:center;}
.prob__ic img{width:56px;height:56px;object-fit:contain;}
.prob__t{font-size:14px;font-weight:700;color:var(--ink);line-height:1.6;}
.prob__d{font-size:12px;color:var(--muted);line-height:1.7;}
.prob-note{
  margin-top:22px;font-size:14px;color:var(--teal-deep);font-weight:700;
  display:flex;align-items:center;gap:10px;
}
.prob-note::before{content:"";width:30px;height:2px;background:var(--teal);}

/* =============================================================
   03 — Solution
   ============================================================= */
.sol-row{display:flex;gap:20px;align-items:stretch;margin-top:18px;}
.sol-col{flex:1;display:flex;flex-direction:column;gap:10px;}
.sol{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:11px 16px;display:flex;gap:13px;align-items:flex-start;box-shadow:var(--shadow);
}
.sol .ichip{width:38px;height:38px;flex-basis:38px;}
.sol__h{font-weight:700;font-size:14px;color:var(--ink);}
.sol__d{font-size:11.5px;color:var(--muted);margin-top:4px;line-height:1.6;}
.sol__d b{color:var(--teal-deep);}
.sol-aside{
  width:322px;flex:0 0 322px;border-radius:var(--radius);
  background:var(--teal-deep);color:#eafaf8;padding:16px 22px;display:flex;flex-direction:column;justify-content:center;
}
.sol-aside h3{font-family:var(--f-display);font-weight:900;font-size:19px;color:#fff;line-height:1.4;margin-top:8px;}
.sol-aside p{font-size:11.5px;color:#c6ebe7;margin-top:8px;line-height:1.72;}
.sol-aside .hl-sun{color:var(--sun);font-weight:700;}

/* 03 — cut / keep band */
.cut-band{margin-top:16px;display:flex;gap:16px;align-items:stretch;}
.cut-band__intro{flex:1;background:var(--mist);border-radius:12px;padding:13px 18px;display:flex;flex-direction:column;justify-content:center;}
.cut-band__intro b{display:block;font-family:var(--f-display);font-weight:900;font-size:14px;color:var(--teal-deep);line-height:1.45;}
.cut-band__intro p{font-size:11px;color:var(--muted);margin-top:7px;line-height:1.6;}
.cut-cols{flex:0 0 50%;display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.cut-col{border-radius:12px;padding:11px 14px;}
.cut-col--minus{background:#fdecea;border:1px solid #f3c8c2;}
.cut-col--keep{background:#eafaf6;border:1px solid #c3e8e2;}
.cut-col__h{display:inline-block;font-family:var(--f-display);font-weight:700;font-size:12px;margin-bottom:7px;}
.cut-col--minus .cut-col__h{color:#c0392b;}
.cut-col--keep .cut-col__h{color:var(--teal-deep);}
.cut-col ul{display:flex;flex-direction:column;gap:5px;}
.cut-col li{font-size:10.5px;color:var(--ink);padding-left:14px;position:relative;line-height:1.35;}
.cut-col--minus li::before{content:"−";position:absolute;left:0;color:#c0392b;font-weight:800;}
.cut-col--keep li::before{content:"";position:absolute;left:2px;top:.42em;width:6px;height:6px;border-radius:50%;background:var(--teal);}
.cut-close{margin-top:12px;text-align:center;font-size:12.5px;color:var(--teal-deep);font-weight:700;}
.cut-close b{background:linear-gradient(transparent 62%, var(--sun-soft) 62%);padding:0 .1em;}

/* =============================================================
   04 — What is / monthly cycle (signature)
   ============================================================= */
.cycle-wrap{flex:1;display:flex;gap:30px;align-items:center;margin-top:8px;min-height:0;}
.cycle{position:relative;width:430px;height:430px;flex:0 0 430px;}
.cycle__ring{
  position:absolute;inset:0;border-radius:50%;
  border:2px dashed var(--line);
}
.cycle__core{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:190px;height:190px;border-radius:50%;
  background:var(--teal-deep);color:#fff;
  display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;
  box-shadow:0 18px 40px rgba(11,63,60,.28);
}
.cycle__core small{font-family:var(--f-num);font-size:11px;letter-spacing:.16em;color:#8fe6de;text-transform:uppercase;}
.cycle__core b{font-family:var(--f-display);font-weight:900;font-size:26px;margin-top:4px;color:var(--sun);}
.cycle__core b .sun{color:var(--sun);}
.cycle__core span{font-size:11px;color:#bfe9e4;margin-top:6px;}
.cnode{
  position:absolute;width:120px;
  left:50%;top:50%;
  transform:translate(-50%,-50%) rotate(var(--a)) translateY(-205px) rotate(calc(-1 * var(--a)));
}
.cnode i{
  display:flex;align-items:center;justify-content:center;
  width:52px;height:52px;border-radius:50%;background:#fff;border:2px solid var(--teal);
  margin:0 auto 6px;box-shadow:var(--shadow);
}
.cnode i svg{width:24px;height:24px;stroke:var(--teal);stroke-width:1.7;fill:none;stroke-linecap:round;stroke-linejoin:round;}
.cnode i b{font-family:var(--f-num);font-weight:800;color:var(--teal);font-size:15px;}
.cnode p{text-align:center;font-size:12px;font-weight:700;color:var(--ink);line-height:1.35;}
.cnode.is-loop i{background:var(--sun);border-color:var(--sun);}
.cnode.is-loop i svg{stroke:var(--sun-deep);}

.cycle-side{flex:1;}
.cycle-side h3{font-family:var(--f-display);font-weight:900;font-size:22px;line-height:1.4;}
.cycle-side h3 .hl{color:var(--teal);}
.cycle-side p{font-size:13.5px;color:var(--muted);margin-top:14px;line-height:1.85;}
.incl{margin-top:20px;background:var(--sun-soft);border:1px solid #f2e3a8;border-radius:12px;padding:16px 18px;}
.incl h4{font-size:13px;color:var(--sun-deep);font-weight:700;display:flex;align-items:center;gap:8px;}
.incl ul{margin-top:10px;display:grid;grid-template-columns:1fr 1fr;gap:8px 16px;}
.incl li{font-size:12.5px;color:var(--ink);}

/* =============================================================
   05 — Comparison table
   ============================================================= */
.cmp{width:100%;border-collapse:separate;border-spacing:0;margin-top:20px;font-size:13px;flex:1;}
.cmp th,.cmp td{padding:11px 16px;text-align:left;vertical-align:middle;}
.cmp thead th{
  font-family:var(--f-num);font-size:12px;letter-spacing:.04em;
  color:var(--muted);font-weight:700;border-bottom:2px solid var(--line);
  text-transform:uppercase;
}
.cmp thead th.c-we{color:#fff;}
.cmp thead .h-we{
  background:var(--teal);border-radius:12px 12px 0 0;text-align:center;
}
.cmp thead .h-we .lg{display:flex;align-items:center;justify-content:center;gap:8px;font-family:var(--f-display);font-size:15px;font-weight:900;}
.cmp thead .h-we img{height:20px;width:auto;}
.cmp tbody th{font-weight:700;color:var(--ink);font-size:13px;width:150px;}
.cmp tbody td{color:var(--muted);border-bottom:1px solid var(--line);}
.cmp td.c-we{
  background:#f1f9f8;color:var(--teal-deep);font-weight:700;text-align:center;
  border-bottom:1px solid #d6ebe8;border-left:1px solid #d6ebe8;border-right:1px solid #d6ebe8;
}
.cmp tbody tr:last-child td.c-we{border-bottom:2px solid var(--teal);border-radius:0 0 12px 12px;}
.cmp td.c-other{text-align:center;}
.cmp thead th.c-other{text-align:center;}
/* 欄の間の区切り縦線 */
.cmp th.c-other,.cmp td.c-other{border-left:1px solid var(--line);}
.cmp .yes{color:var(--teal);font-weight:800;}
.cmp .no{color:#b9c3c1;}
.cmp-note{margin-top:14px;font-size:11px;color:#9aa8a5;}

/* =============================================================
   06 — Strengths (6)
   ============================================================= */
.str-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:24px;flex:1;}
.str{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:20px;box-shadow:var(--shadow);position:relative;display:flex;flex-direction:column;
}
.str__n{position:absolute;top:16px;right:18px;font-family:var(--f-num);font-weight:800;font-size:13px;color:var(--teal);opacity:.5;}
.str__ic{width:46px;height:46px;border-radius:12px;background:var(--mist);display:flex;align-items:center;justify-content:center;margin-bottom:12px;}
.str__ic svg{width:26px;height:26px;stroke:var(--teal);stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round;}
.str__ic img{width:28px;height:28px;object-fit:contain;}
.str__h{font-family:var(--f-display);font-weight:700;font-size:14px;color:var(--ink);line-height:1.4;white-space:nowrap;letter-spacing:-.01em;}
.str__d{font-size:11.5px;color:var(--muted);margin-top:8px;line-height:1.72;}

/* =============================================================
   07 — Common services (3 categories)
   ============================================================= */
.svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:22px;flex:1;}
.svc{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);display:flex;flex-direction:column;}
.svc__hd{padding:16px 20px;background:var(--teal-deep);color:#fff;display:flex;align-items:center;gap:12px;}
.svc__hd .ic{width:34px;height:34px;border-radius:9px;background:rgba(255,255,255,.14);display:flex;align-items:center;justify-content:center;}
.svc__hd .ic svg{width:20px;height:20px;stroke:#eafaf8;stroke-width:1.7;fill:none;stroke-linecap:round;stroke-linejoin:round;}
.svc__hd b{font-family:var(--f-display);font-weight:700;font-size:15px;}
.svc__hd small{display:block;font-family:var(--f-num);font-size:10px;letter-spacing:.12em;color:#8fe6de;text-transform:uppercase;}
.svc__lead{padding:13px 20px 4px;font-size:11.5px;color:var(--teal-deep);font-weight:700;line-height:1.5;border-bottom:1px solid var(--line);}
.svc__list{padding:6px 20px 12px;display:flex;flex-direction:column;justify-content:space-between;flex:1;}
.svc__list li{font-size:12px;color:var(--ink);line-height:1.5;letter-spacing:-.01em;padding:10px 0 10px 26px;border-bottom:1px dashed var(--line);}
.svc__list li:last-child{border-bottom:none;}
.svc__seo{font-size:11.5px;}
.svc__list .chk::before{top:50%;transform:translateY(-50%);}
.svc-band{margin-top:18px;background:var(--teal-deep);border-radius:14px;padding:16px 24px;display:flex;align-items:center;gap:22px;color:#eafaf8;}
.svc-band__msg{font-size:13px;line-height:1.6;flex:1;}
.svc-band__msg b{color:#fff;}
.svc-band__facts{display:flex;gap:9px;flex-shrink:0;}
.svc-band__facts span{background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.2);border-radius:9px;padding:8px 13px;font-size:11.5px;color:#dcf3f0;font-weight:700;white-space:nowrap;}
.svc-band__facts b{color:var(--sun);font-family:var(--f-num);font-weight:800;}

/* =============================================================
   08 — Pricing
   ============================================================= */
.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:18px;flex:1;align-items:start;align-content:center;}
.plan{
  background:#fff;border:1px solid var(--line);border-radius:16px;
  padding:22px 20px;display:flex;flex-direction:column;box-shadow:var(--shadow);position:relative;
}
.plan--feat{border:2px solid var(--teal);box-shadow:0 20px 44px rgba(23,135,130,.16);transform:translateY(-8px);}
.plan__badge{
  position:absolute;top:-13px;left:50%;transform:translateX(-50%);
  background:var(--teal);color:#fff;font-size:11px;font-weight:700;
  padding:5px 16px;border-radius:999px;letter-spacing:.04em;white-space:nowrap;
}
.plan__head{display:flex;align-items:center;gap:11px;}
.plan__icon{width:42px;height:42px;flex:0 0 42px;object-fit:contain;}
.plan__name{font-family:var(--f-display);font-weight:900;font-size:19px;color:var(--ink);}
.plan__for{font-size:11.5px;color:var(--teal-deep);margin-top:6px;min-height:32px;line-height:1.5;font-weight:700;}
.plan__price{margin-top:12px;display:flex;justify-content:center;align-items:baseline;gap:3px;font-family:var(--f-num);color:var(--ink);}
.plan__price .cur{font-size:15px;font-weight:700;}
.plan__price .num{font-size:40px;font-weight:800;letter-spacing:-.01em;line-height:1;}
.plan__price .unit{font-size:13px;color:var(--muted);font-weight:700;}
.plan__init{margin-top:8px;font-size:11.5px;color:var(--teal);font-weight:700;text-align:center;}
.plan__init b{background:var(--sun-soft);padding:1px 7px;border-radius:5px;color:var(--sun-deep);}
.plan__pages{margin-top:14px;padding:9px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);text-align:center;font-size:12.5px;color:var(--ink);}
.plan__pages b{font-family:var(--f-num);font-size:20px;color:var(--teal-deep);}
.plan__feats{margin-top:14px;display:flex;flex-direction:column;gap:10px;}
.plan__feats li{font-size:12px;color:var(--muted);line-height:1.5;}
.plan__use{margin-top:14px;padding:11px 13px;background:var(--mist);border-radius:10px;font-size:11.5px;color:var(--teal-deep);line-height:1.6;}
.plan--feat .plan__use{background:var(--sun-soft);color:var(--sun-deep);}
.price-note{margin-top:16px;font-size:11px;color:#9aa8a5;text-align:center;}

/* =============================================================
   10 — Options
   ============================================================= */
.opt-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:18px;}
.opt-card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:16px 16px 14px;box-shadow:var(--shadow);display:flex;flex-direction:column;}
.opt-card__head{display:flex;align-items:center;gap:10px;margin-bottom:9px;}
.opt-card__ic{width:40px;height:40px;flex:0 0 40px;}
.opt-card__ic img{width:40px;height:40px;object-fit:contain;}
.opt-card__t{font-family:var(--f-display);font-weight:700;font-size:13.5px;color:var(--ink);line-height:1.35;}
.opt-card__d{font-size:11px;color:var(--muted);margin-top:0;line-height:1.65;flex:1;}
.opt-card__price{
  margin-top:11px;padding-top:10px;border-top:1px solid var(--line);text-align:center;
  font-family:var(--f-num);font-weight:800;font-size:18px;color:var(--teal-deep);
}
.opt-card__price span{font-size:11px;color:var(--muted);font-weight:700;margin-left:4px;}
.opt-card__price--quote{font-family:var(--f-display);font-size:14px;color:var(--teal);}
.opt-note{
  margin-top:16px;text-align:center;font-size:12px;color:var(--sun-deep);font-weight:700;
  background:var(--sun-soft);border:1px solid #f2e3a8;border-radius:10px;padding:11px 16px;
}

/* =============================================================
   09 — Plan chooser
   ============================================================= */
.choose{display:grid;grid-template-columns:1fr 1fr 1fr;gap:18px;margin-top:22px;}
.branch{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  overflow:hidden;box-shadow:var(--shadow);display:flex;flex-direction:column;
}
.branch__q{padding:20px 20px 16px;}
.branch__spec{
  display:flex;margin:0 20px 16px;border:1px solid var(--line);border-radius:10px;overflow:hidden;
}
.branch__spec>div{flex:1;padding:9px 12px;text-align:center;}
.branch__spec>div:first-child{border-right:1px solid var(--line);}
.branch__spec span{display:block;font-size:10px;color:var(--muted);font-weight:700;letter-spacing:.04em;}
.branch__spec b{font-family:var(--f-num);font-weight:800;font-size:15px;color:var(--teal-deep);}
.branch--feat .branch__spec b{color:var(--teal);}
.branch__ic{width:26px;height:26px;flex:0 0 26px;object-fit:contain;margin-right:2px;background:#fff;border-radius:50%;padding:2px;}
.branch__q .lab{font-family:var(--f-num);font-weight:800;font-size:12px;color:var(--teal);letter-spacing:.1em;}
.branch__q p{font-size:14px;color:var(--ink);font-weight:700;margin-top:10px;line-height:1.7;}
.branch__q ul{margin-top:12px;display:flex;flex-direction:column;gap:7px;}
.branch__q li{font-size:12px;color:var(--muted);padding-left:18px;position:relative;}
.branch__q li::before{content:"";position:absolute;left:0;top:.5em;width:7px;height:7px;border-radius:2px;background:var(--mist-2);}
.branch__a{padding:14px 18px;background:var(--teal-deep);color:#fff;display:flex;align-items:center;gap:9px;margin-top:auto;}
.branch__a .arw{font-size:11px;color:#8fe6de;letter-spacing:.06em;}
.branch__a b{font-family:var(--f-display);font-weight:900;font-size:17px;margin-left:auto;}
.branch--feat .branch__a{background:var(--teal);}
.branch--feat .branch__a b .tag{font-size:10px;background:var(--sun);color:var(--sun-deep);padding:2px 7px;border-radius:5px;margin-left:8px;vertical-align:middle;}

/* bottom reassurance band */
.choose-band{
  margin-top:20px;background:var(--teal-deep);border-radius:14px;
  padding:18px 24px;display:flex;align-items:center;gap:18px;color:#eafaf8;
}
.choose-band__ic{width:44px;height:44px;flex:0 0 44px;border-radius:11px;background:rgba(255,255,255,.12);display:flex;align-items:center;justify-content:center;}
.choose-band__ic svg{width:24px;height:24px;stroke:var(--sun);stroke-width:1.7;fill:none;stroke-linecap:round;stroke-linejoin:round;}
.choose-band__tx{flex:1;font-size:13px;line-height:1.7;}
.choose-band__tx b{color:#fff;}
.choose-band__cta{
  flex-shrink:0;background:var(--sun);color:#2a2100;font-weight:800;font-size:13px;
  padding:11px 20px;border-radius:10px;white-space:nowrap;
}

/* =============================================================
   10 — Production flow  /  11 — After launch
   ============================================================= */
.flow-center{flex:1;display:flex;flex-direction:column;justify-content:center;}
.flow{display:flex;gap:0;align-items:stretch;width:100%;}
.step{flex:1;position:relative;display:flex;flex-direction:column;padding:0 8px;}
.flow-band{
  margin-top:auto;
  background:var(--teal-deep);color:#eafaf8;border-radius:14px;
  padding:20px 28px;font-size:14px;line-height:1.7;
  display:flex;align-items:center;gap:14px;
}
.flow-band svg{width:26px;height:26px;flex:0 0 26px;stroke:var(--sun);stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round;}
.flow-band b{color:#fff;}
.step__top{display:flex;align-items:center;margin-bottom:14px;}
.step__n{
  width:38px;height:38px;flex:0 0 38px;border-radius:50%;background:var(--teal);color:#fff;
  display:flex;align-items:center;justify-content:center;font-family:var(--f-num);font-weight:800;font-size:16px;z-index:2;
}
.step__line{flex:1;height:2px;background:var(--line);position:relative;}
.step:last-child .step__line{display:none;}
.step__ic{width:40px;height:40px;border-radius:11px;background:var(--mist);display:flex;align-items:center;justify-content:center;margin-bottom:10px;}
.step__ic svg{width:22px;height:22px;stroke:var(--teal);stroke-width:1.7;fill:none;stroke-linecap:round;stroke-linejoin:round;}
.step__ic img{width:24px;height:24px;object-fit:contain;}
.step__h{font-weight:700;font-size:13.5px;color:var(--ink);line-height:1.4;min-height:2.8em;}
.step__d{font-size:11px;color:var(--muted);margin-top:6px;line-height:1.6;min-height:3.2em;}
.step__prep{margin-top:14px;padding-top:12px;border-top:1px dashed var(--line);}
.step__prep .lab{display:inline-block;font-size:10px;font-weight:700;color:var(--sun-deep);background:var(--sun-soft);padding:2px 8px;border-radius:5px;margin-bottom:5px;}
.step__prep p{font-size:10.5px;color:var(--muted);line-height:1.55;}

/* ---- 11 after-launch (redesign): hero band + 6 cards + consult strip ---- */
.after2-hero{
  display:flex;gap:26px;align-items:center;
  background:var(--teal-deep);border-radius:16px;padding:20px 26px;color:#eafaf8;margin-top:14px;
}
.after2-hero__l{flex:0 0 37%;}
.after2-h{font-family:var(--f-display);font-weight:900;font-size:23px;line-height:1.42;color:#fff;}
.after2-h .sun{color:var(--sun);}
.after2-tag{margin-top:12px;font-size:12px;color:#bfe9e4;}
.after2-tag b{color:var(--sun);font-weight:700;}
.after2-hero__r{flex:1;border-left:1px solid rgba(255,255,255,.16);padding-left:26px;}
.after2-hero__r p{font-size:12px;line-height:1.95;color:#cdeeea;text-wrap:pretty;letter-spacing:.01em;}

.after2-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:14px;}
.after2-card{
  background:#fff;border:1px solid var(--line);border-radius:12px;
  padding:15px 17px;box-shadow:var(--shadow);position:relative;
}
.after2-n{position:absolute;top:13px;right:16px;font-family:var(--f-num);font-weight:800;font-size:13px;color:var(--teal);opacity:.45;}
.after2-head{display:flex;align-items:center;gap:11px;margin-bottom:9px;}
.after2-ic{width:40px;height:40px;flex:0 0 40px;display:flex;align-items:center;justify-content:center;}
.after2-ic svg{width:20px;height:20px;stroke:var(--teal);stroke-width:1.7;fill:none;stroke-linecap:round;stroke-linejoin:round;}
.after2-ic img{width:40px;height:40px;object-fit:contain;}
.after2-card b{font-family:var(--f-display);font-weight:700;font-size:14px;color:var(--ink);}
.after2-card p{font-size:11.5px;color:var(--muted);margin-top:7px;line-height:1.65;}

.after2-consult{
  margin-top:14px;background:var(--sun-soft);border:1px solid #f2e3a8;border-radius:12px;
  padding:14px 20px;display:flex;align-items:center;gap:22px;
}
.after2-consult__hd{
  flex:0 0 auto;font-family:var(--f-display);font-weight:700;font-size:13.5px;color:var(--sun-deep);
  display:flex;align-items:center;gap:10px;line-height:1.45;
}
.after2-consult__hd svg{width:26px;height:26px;flex:0 0 26px;stroke:var(--sun-deep);stroke-width:1.7;fill:none;stroke-linecap:round;stroke-linejoin:round;}
.after2-consult__pills{flex:1;display:flex;flex-wrap:wrap;gap:8px;}
.after2-consult__pills span{
  background:#fff;border:1px solid #f0dfa0;border-radius:999px;
  padding:7px 14px;font-size:12px;color:var(--ink);font-weight:700;
}

/* after-launch: orbit layout, different from flow */
.after{display:flex;gap:28px;margin-top:20px;flex:1;align-items:center;}
.after-hero{
  flex:0 0 340px;border-radius:16px;padding:28px;
  background:var(--teal-deep);color:#fff;align-self:stretch;display:flex;flex-direction:column;
}
.after-hero .eyebrow{color:#7fe3db;}
.after-hero h3{font-family:var(--f-display);font-weight:900;font-size:26px;line-height:1.4;margin-top:14px;}
.after-hero h3 .sun{color:var(--sun);}
.after-hero p{font-size:13px;color:#bfe9e4;margin-top:16px;line-height:1.9;}
.after-hero .tag{margin-top:auto;font-size:12px;color:#8fe6de;display:flex;align-items:center;gap:8px;}
.after-hero .tag::before{content:"";width:26px;height:2px;background:var(--sun);}
.after-list{flex:1;display:grid;grid-template-columns:1fr 1fr;gap:14px;align-self:stretch;align-content:center;}
.after-item{display:flex;gap:13px;align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:12px;padding:15px 16px;box-shadow:var(--shadow);}
.after-item .ichip{width:38px;height:38px;flex-basis:38px;}
.after-item b{font-size:13px;color:var(--ink);}
.after-item p{font-size:11px;color:var(--muted);margin-top:4px;line-height:1.6;}

/* =============================================================
   12 — Use cases
   ============================================================= */
.uc-grid{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:1fr 1fr;gap:16px;margin-top:22px;flex:1;}
.uc{
  border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);
  background:#fff;box-shadow:var(--shadow);display:flex;flex-direction:column;
}
.uc__vis{height:82px;position:relative;overflow:hidden;display:flex;align-items:center;padding:0 16px;gap:10px;}
.uc__vis .mn{width:52px;height:52px;border-radius:10px;background:rgba(255,255,255,.85);display:flex;align-items:center;justify-content:center;}
.uc__vis .mn svg{width:26px;height:26px;stroke:var(--teal-deep);stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round;}
.uc__vis .tg{font-family:var(--f-num);font-size:10px;font-weight:700;letter-spacing:.08em;color:#fff;text-transform:uppercase;background:rgba(0,0,0,.18);padding:3px 9px;border-radius:5px;}
.uc__b{padding:14px 16px;flex:1;}
.uc__b b{font-size:14px;color:var(--ink);font-weight:700;}
.uc__b p{font-size:11.5px;color:var(--muted);margin-top:6px;line-height:1.65;}
.uc-note{margin-top:16px;font-size:11px;color:#9aa8a5;text-align:center;}

/* 12/13 — detailed use-case cards */
.uc2-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:18px;}
.uc2{background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden;box-shadow:var(--shadow);display:flex;flex-direction:column;}
.uc2__vis{height:60px;position:relative;display:flex;align-items:center;padding:0 18px;gap:12px;}
.uc2__vis .mn{width:40px;height:40px;border-radius:10px;background:rgba(255,255,255,.88);display:flex;align-items:center;justify-content:center;}
.uc2__vis .mn svg{width:22px;height:22px;stroke:var(--teal-deep);stroke-width:1.7;fill:none;stroke-linecap:round;stroke-linejoin:round;}
.uc2__vis .tg{font-family:var(--f-num);font-size:10px;font-weight:700;letter-spacing:.08em;color:#fff;text-transform:uppercase;background:rgba(0,0,0,.2);padding:3px 9px;border-radius:5px;}
.uc2__n{position:absolute;top:11px;right:16px;font-family:var(--f-num);font-weight:800;font-size:16px;color:rgba(255,255,255,.9);}
.uc2__b{padding:15px 17px 16px;flex:1;display:flex;flex-direction:column;}
.uc2__t{font-family:var(--f-display);font-weight:900;font-size:15px;color:var(--ink);line-height:1.4;}
.uc2__sub{font-size:12px;color:var(--teal);font-weight:700;margin-top:7px;line-height:1.5;}
.uc2__d{font-size:11px;color:var(--muted);margin-top:9px;line-height:1.7;}
.uc2__exp{margin-top:12px;background:var(--mist);border-radius:10px;padding:11px 13px;}
.uc2__exp-lab{display:inline-block;font-size:10px;font-weight:700;color:var(--teal-deep);background:#fff;border:1px solid var(--line);padding:2px 9px;border-radius:5px;margin-bottom:8px;}
.uc2__exp ul{display:flex;flex-direction:column;gap:6px;}
.uc2__exp li{font-size:11px;color:var(--ink);padding-left:16px;position:relative;line-height:1.45;}
.uc2__exp li::before{content:"";position:absolute;left:0;top:.5em;width:7px;height:7px;border-radius:50%;background:var(--teal);}

.uc2-band{
  margin-top:18px;background:var(--teal-deep);border-radius:14px;
  padding:18px 26px;display:flex;align-items:center;gap:26px;color:#eafaf8;
}
.uc2-band__l{flex:1;border-right:1px solid rgba(255,255,255,.16);padding-right:26px;}
.uc2-band__l b{display:block;font-family:var(--f-display);font-weight:900;font-size:16px;color:#fff;}
.uc2-band__l p{font-size:12px;line-height:1.85;color:#c6ebe7;margin-top:9px;}
.uc2-band__r{flex:0 0 210px;font-family:var(--f-display);font-weight:700;font-size:15px;line-height:1.6;color:#fff;}
.uc2-band__r .sun{color:var(--sun);}

/* 12 — supporting note panel (fills lower space) */
.uc2-note{margin-top:18px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:18px 24px;box-shadow:var(--shadow);}
.uc2-note__head{display:flex;gap:24px;align-items:center;}
.uc2-note__head b{flex:0 0 38%;font-family:var(--f-display);font-weight:900;font-size:15.5px;color:var(--teal-deep);line-height:1.5;}
.uc2-note__head p{flex:1;font-size:12px;color:var(--muted);line-height:1.85;border-left:1px solid var(--line);padding-left:24px;}
.uc2-note__items{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:16px;}
.uc2-note__items>div{display:flex;gap:12px;align-items:center;background:var(--mist);border-radius:10px;padding:12px 15px;}
.uc2-note__ic{width:36px;height:36px;flex:0 0 36px;border-radius:9px;background:#fff;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;}
.uc2-note__ic svg{width:19px;height:19px;stroke:var(--teal);stroke-width:1.7;fill:none;stroke-linecap:round;stroke-linejoin:round;}
.uc2-note__items b{font-family:var(--f-display);font-weight:700;font-size:13.5px;color:var(--ink);}
.uc2-note__items p{font-size:11px;color:var(--muted);margin-top:3px;line-height:1.5;}

/* =============================================================
   13 — FAQ
   ============================================================= */
.faq-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px 26px;margin-top:20px;flex:1;align-content:start;}
.faq{border-bottom:1px solid var(--line);padding:12px 0;}
.faq__q{display:flex;gap:11px;align-items:flex-start;font-size:13px;font-weight:700;color:var(--ink);cursor:pointer;list-style:none;}
.faq__q .q{font-family:var(--f-num);font-weight:800;color:var(--teal);flex:0 0 auto;}
.faq__q .tog{margin-left:auto;flex:0 0 18px;width:18px;height:18px;position:relative;transition:transform .25s;}
.faq__q .tog::before,.faq__q .tog::after{content:"";position:absolute;background:var(--teal);border-radius:2px;}
.faq__q .tog::before{left:3px;right:3px;top:8px;height:2px;}
.faq__q .tog::after{top:3px;bottom:3px;left:8px;width:2px;height:12px;transition:opacity .25s;}
.faq[open] .faq__q .tog::after{opacity:0;}
.faq__a{font-size:12px;color:var(--muted);line-height:1.75;padding:9px 0 2px 27px;}
.faq__a .flag{color:var(--sun-deep);font-weight:700;}

/* =============================================================
   14 — CTA
   ============================================================= */
.cta{
  padding:0;color:#eafaf8;
  background:
     radial-gradient(120% 90% at 90% 6%, #1f9a94 0%, rgba(31,154,148,0) 52%),
     radial-gradient(130% 120% at 0% 110%, #0c4b48 0%, rgba(12,75,72,0) 55%),
     var(--teal-deep);
}
.cta .spine{background:rgba(255,255,255,.10);}
.cta__grid{position:relative;z-index:2;height:100%;display:grid;grid-template-columns:1.25fr .75fr;}
.cta__left{padding:58px 30px 46px 88px;display:flex;flex-direction:column;}
.cta__ey{font-family:var(--f-num);font-weight:700;font-size:13px;letter-spacing:.24em;text-transform:uppercase;color:#8fe6de;}
.cta h2{font-family:var(--f-display);font-weight:900;font-size:40px;line-height:1.34;color:#fff;margin-top:16px;}
.cta h2 .sun{color:var(--sun);}
.cta__points{margin-top:22px;display:grid;grid-template-columns:1fr 1fr;gap:11px 18px;}
.cta__points li{font-size:13px;color:#dcf3f0;display:flex;gap:9px;align-items:flex-start;}
.cta__points li svg{width:18px;height:18px;flex:0 0 18px;margin-top:2px;stroke:var(--sun);stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round;}
.cta__contact{margin-top:auto;display:flex;gap:12px;align-items:center;flex-wrap:wrap;}
.cta__btn{background:var(--sun);color:#2a2100;font-weight:800;font-size:15px;padding:14px 26px;border-radius:12px;display:inline-flex;align-items:center;gap:9px;box-shadow:0 10px 24px rgba(255,196,0,.28);}
.cta__url{font-family:var(--f-num);font-size:14px;color:#eafaf8;font-weight:600;}
.cta__right{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 40px 40px 0;}
.qr-card{background:#fff;border-radius:16px;padding:20px;text-align:center;box-shadow:0 24px 50px rgba(0,0,0,.32);width:220px;}
.qr-card img{width:180px;height:180px;margin:0 auto;}
.qr-card p{font-size:12px;color:var(--ink);font-weight:700;margin-top:12px;}
.qr-card small{font-family:var(--f-num);font-size:11px;color:var(--teal);}

/* =============================================================
   15 — Consult / reassurance panels
   ============================================================= */
.assure-cols{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:24px;}
.assure-panel{background:#fff;border:1px solid var(--line);border-radius:16px;padding:22px 26px;box-shadow:var(--shadow);}
.assure-panel h3{
  display:flex;align-items:center;gap:11px;
  font-family:var(--f-display);font-weight:900;font-size:16px;color:var(--ink);
  padding-bottom:14px;margin-bottom:14px;border-bottom:1px solid var(--line);
}
.assure-ic{width:38px;height:38px;flex:0 0 38px;border-radius:10px;background:var(--mist);display:flex;align-items:center;justify-content:center;}
.assure-ic svg{width:21px;height:21px;stroke:var(--teal);stroke-width:1.7;fill:none;stroke-linecap:round;stroke-linejoin:round;}
.assure-panel--sun .assure-ic{background:var(--sun-soft);}
.assure-panel--sun .assure-ic svg{stroke:var(--sun-deep);}
.assure-panel ul{display:flex;flex-direction:column;gap:13px;}
.assure-panel li{font-size:13px;color:var(--ink);line-height:1.5;}
.assure-panel--sun li.chk::before{background-color:var(--sun-deep);}

/* 15 — clarify trio */
.clarify{margin-top:22px;}
.clarify__lab{display:flex;align-items:center;gap:11px;}
.clarify__lab span{font-family:var(--f-num);font-weight:700;font-size:12px;letter-spacing:.14em;color:var(--teal);text-transform:uppercase;}
.clarify__lab::before{content:"";width:22px;height:2px;background:var(--sun);border-radius:2px;}
.clarify__items{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:13px;}
.clarify__item{background:#fff;border:1px solid var(--line);border-radius:12px;padding:15px 18px;box-shadow:var(--shadow);}
.clarify__n{font-family:var(--f-num);font-weight:800;font-size:14px;color:var(--teal);opacity:.6;}
.clarify__item b{display:block;font-family:var(--f-display);font-weight:700;font-size:14px;color:var(--ink);margin-top:3px;}
.clarify__item p{font-size:11.5px;color:var(--muted);margin-top:7px;line-height:1.65;}
.clarify__close{margin-top:15px;text-align:center;font-size:13px;color:var(--teal-deep);font-weight:700;}
.clarify__close b{background:linear-gradient(transparent 62%, var(--sun-soft) 62%);padding:0 .1em;}

/* =============================================================
   16 — CTA (with flow + closing)
   ============================================================= */
.cta2{position:relative;z-index:2;height:100%;display:grid;grid-template-columns:1fr 296px;}
.cta2__l{padding:42px 26px 38px 88px;display:flex;flex-direction:column;}
.cta2 .cta__ey{font-family:var(--f-num);font-weight:700;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:#8fe6de;}
.cta2 h2{font-family:var(--f-display);font-weight:900;font-size:34px;line-height:1.32;color:#fff;margin-top:12px;}
.cta2 h2 .sun{color:var(--sun);}
.cta2__flow{margin-top:22px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.15);border-radius:14px;padding:16px 20px;}
.cta2__flow-lab{display:flex;align-items:baseline;gap:12px;}
.cta2__flow-lab b{font-family:var(--f-display);font-weight:700;font-size:14px;color:#fff;}
.cta2__flow-lab span{font-size:11px;color:#8fe6de;}
.cta2__steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:13px;}
.cta2__step{position:relative;padding-left:14px;}
.cta2__step::before{content:"";position:absolute;left:0;top:3px;bottom:3px;width:2px;border-radius:2px;background:var(--sun);}
.cta2__n{font-family:var(--f-num);font-weight:800;font-size:14px;color:var(--sun);}
.cta2__step b{display:block;color:#fff;font-size:14px;margin-top:2px;}
.cta2__step p{font-size:11px;color:#bfe9e4;margin-top:5px;line-height:1.6;}
.cta2__close{margin-top:18px;font-size:12.5px;color:#cdeeea;line-height:1.9;max-width:660px;}
.cta2__close b{color:var(--sun);}
.cta2__msg{margin-top:16px;border-left:3px solid var(--sun);padding-left:18px;max-width:660px;}
.cta2__msg>b{display:block;font-family:var(--f-display);font-weight:900;font-size:16px;color:#fff;line-height:1.5;}
.cta2__msg>p{font-size:12px;color:#cdeeea;line-height:1.85;margin-top:9px;}
.cta2__msg-note{display:flex;align-items:center;gap:9px;font-weight:700;color:#eafaf8 !important;}
.cta2__msg-note .dot{width:7px;height:7px;flex:0 0 7px;border-radius:50%;background:var(--sun);}
.cta2 .cta__contact{margin-top:auto;display:flex;gap:14px;align-items:center;flex-wrap:wrap;padding-top:18px;}
.cta2__urlbig{
  display:inline-flex;align-items:center;gap:11px;
  font-family:var(--f-num);font-weight:700;font-size:22px;color:#fff;letter-spacing:.01em;
}
.cta2__urlbig::before{content:"";width:34px;height:2px;background:var(--sun);border-radius:2px;}
.cta2__r{position:relative;z-index:2;display:flex;align-items:center;justify-content:center;padding-right:36px;}

/* =============================================================
   Screen-only chrome (hidden in print)
   ============================================================= */
.topbar{
  position:sticky;top:0;width:100%;height:52px;z-index:50;
  background:rgba(15,92,88,.96);backdrop-filter:blur(6px);
  display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 20px;color:#fff;
}
.topbar__l{display:flex;align-items:center;gap:10px;font-weight:700;font-size:14px;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
.topbar__l img{height:22px;width:auto;flex:0 0 auto;}
.topbar__r{display:flex;gap:8px;flex:0 0 auto;}
.topbar button{
  font-family:var(--f-body);font-weight:700;font-size:12.5px;white-space:nowrap;
  border:1px solid rgba(255,255,255,.28);background:rgba(255,255,255,.08);color:#fff;
  padding:8px 16px;border-radius:8px;cursor:pointer;transition:.2s;
}
.topbar button:hover{background:var(--sun);color:#2a2100;border-color:var(--sun);}
/* responsive scaling wrapper: transform:scale() fits fixed 1122px slides to any screen (iOS Safari safe) */
.deck-scaler{overflow:hidden;}
.deck{transform-origin:top center;}

/* fade-in */
.reveal{opacity:0;transform:translateY(14px);transition:opacity .6s ease,transform .6s ease;}
.reveal.in{opacity:1;transform:none;}

@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none;}
}

/* narrow screens: compact toolbar (deck itself is scaled to fit via main.js) */
@media (max-width:640px){
  .topbar{height:46px;padding:0 12px;}
  .topbar__l{font-size:12px;gap:7px;}
  .topbar__l img{height:18px;}
  .topbar button{font-size:11px;padding:7px 11px;}
  .deck{padding-left:8px;padding-right:8px;gap:16px;}
}

/* =============================================================
   08 — AI search (background data) / 09 — AI optimization
   ============================================================= */
.ai-charts{
  display:grid;grid-template-columns:1fr 1fr;gap:18px;
  margin-top:20px;flex:1;min-height:0;
}
.ai-chart{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:16px 18px 14px;box-shadow:var(--shadow);
  display:flex;flex-direction:column;min-width:0;
}
.ai-chart__hd{text-align:center;}
.ai-chart__ey{
  font-family:var(--f-num);font-weight:700;font-size:10px;
  letter-spacing:.18em;color:var(--teal);
}
.ai-chart__t{
  font-family:var(--f-display);font-weight:700;font-size:14.5px;
  color:var(--ink);line-height:1.45;margin-top:4px;letter-spacing:-.01em;
}
.ai-chart svg{display:block;width:100%;height:auto;margin-top:10px;}
.ai-src{
  margin-top:auto;padding-top:10px;
  font-size:9px;color:var(--muted);line-height:1.6;text-align:center;
}

/* --- 折れ線グラフ --- */
.ai-line__grid line{stroke:#e9eded;stroke-width:1;}
.ai-line__axis line{stroke:#cfd7d7;stroke-width:1;}
.ai-line__tick text,.ai-line__cat text,.ai-line__axis-t{
  fill:var(--muted);font-family:var(--f-body);font-size:20px;font-weight:700;
}
.ai-line__tick text{text-anchor:end;}
.ai-line__cat text,.ai-line__axis-t{text-anchor:middle;}
.ai-line__axis-t{font-size:19px;}
.ai-line__area{fill:var(--teal);opacity:.1;}
.ai-line__line{fill:none;stroke:var(--teal);stroke-width:3;stroke-linecap:round;stroke-linejoin:round;}
/* サーフェス色のリング：線と重なっても点が読める */
.ai-line__pts circle{fill:var(--teal);stroke:#fff;stroke-width:3;}
.ai-line__val text{
  fill:var(--teal);font-family:var(--f-body);font-size:27px;font-weight:900;text-anchor:middle;
}

/* --- 実測値タイル --- */
.ai-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:12px;}
.ai-stats li{
  background:var(--mist);border-radius:10px;padding:8px 6px;text-align:center;min-width:0;
}
.ai-stats__lab{display:block;font-size:9.5px;font-weight:700;color:var(--muted);white-space:nowrap;}
.ai-stats__v{
  display:block;font-family:var(--f-num);font-weight:800;font-size:21px;
  color:var(--teal);line-height:1.2;letter-spacing:-.01em;
}
.ai-stats__v span{font-size:.6em;}

/* --- ドーナツグラフ --- */
.ai-donut__rest,.ai-donut__val{fill:none;stroke-width:44;}
.ai-donut__rest{stroke:#c9d1d3;}
.ai-donut__val{stroke:var(--teal);}
.ai-donut__lead{fill:none;stroke-width:1.6;}
.ai-donut__lead--rest{stroke:#b3bcbe;}
.ai-donut__lead--val{stroke:var(--teal);}
.ai-donut text{font-family:var(--f-body);text-anchor:middle;}
.ai-donut__key{font-size:21px;font-weight:800;}
.ai-donut__key--rest{fill:var(--muted);}
.ai-donut__key--val{fill:var(--teal);}
.ai-donut__out{font-family:var(--f-num);font-size:44px;font-weight:800;letter-spacing:-.01em;}
.ai-donut__out--rest{fill:#55605f;}
.ai-donut__out--val{fill:var(--teal);}
.ai-donut__pct{font-size:.6em;}
.ai-donut__hero{
  fill:var(--teal);font-family:var(--f-num);font-size:55px;font-weight:800;letter-spacing:-.02em;
}
.ai-donut__hero-pct{font-size:.52em;}
.ai-donut__note{fill:var(--ink);font-size:15px;font-weight:700;}

.ai-callout{
  margin-top:10px;padding:9px 12px;border-radius:10px;background:var(--mist);
  font-size:10.5px;font-weight:700;line-height:1.75;color:var(--ink);text-align:center;
}
.ai-callout b{font-weight:800;}
.ai-callout__hl{color:var(--teal);}

/* --- 09: 3つの設計 の締めの一言 --- */
.ai-note{
  display:flex;align-items:center;gap:10px;
  margin-top:18px;padding:13px 18px;border-radius:var(--radius);
  background:var(--sun-soft);border:1px solid #f2e2ae;
  font-size:13px;font-weight:700;color:var(--sun-deep);line-height:1.7;
}
.ai-note b{color:var(--ink);font-weight:800;}
.ai-note__ic{flex:0 0 auto;width:20px;height:20px;}
.ai-note__ic svg{
  width:20px;height:20px;stroke:var(--sun-deep);stroke-width:1.8;fill:none;
  stroke-linecap:round;stroke-linejoin:round;
}
.ai-ex{
  margin-top:auto;padding:10px 12px;border-radius:10px;
  background:var(--mist);font-size:10.5px;line-height:1.7;color:var(--teal-ink);
}
.ai-ex__lab{
  display:block;font-family:var(--f-num);font-weight:800;font-size:9px;
  letter-spacing:.16em;color:var(--teal);margin-bottom:3px;
}

/* 09: 3つの設計（横並び3行） */
.ai-rows{display:flex;flex-direction:column;gap:14px;margin-top:20px;flex:1;min-height:0;}
.ai-row{
  flex:1;min-height:0;
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:var(--shadow);padding:14px 20px;
  display:grid;grid-template-columns:252px 1fr 296px;gap:22px;align-items:center;
}
.ai-row__hd{display:flex;align-items:center;gap:11px;min-width:0;}
.ai-row__ic{
  flex:0 0 auto;width:42px;height:42px;border-radius:11px;background:var(--mist);
  display:flex;align-items:center;justify-content:center;
}
.ai-row__ic svg{
  width:23px;height:23px;stroke:var(--teal);stroke-width:1.6;fill:none;
  stroke-linecap:round;stroke-linejoin:round;
}
.ai-row__n{
  flex:0 0 auto;font-family:var(--f-num);font-weight:800;font-size:12px;
  color:var(--teal);opacity:.55;
}
.ai-row__t{
  font-family:var(--f-display);font-weight:700;font-size:13.5px;color:var(--ink);
  line-height:1.4;letter-spacing:-.01em;
}
.ai-row__d{font-size:11.5px;color:var(--muted);line-height:1.75;}
.ai-row__ex{
  padding:10px 13px;border-radius:10px;background:var(--mist);
  font-size:10.5px;line-height:1.7;color:var(--teal-ink);
}
.ai-row__ex-lab{
  display:block;font-family:var(--f-num);font-weight:800;font-size:9px;
  letter-spacing:.16em;color:var(--teal);margin-bottom:3px;
}

/* -------------------------------------------------------------
   既存2枚の微小なはみ出し解消
   .page は overflow:hidden のため、数px超えると印刷時に末尾が切れる。
   同クラスを使う他スライドに影響しないようスライド単位で調整。
   ------------------------------------------------------------- */
#p15 .uc2-grid{margin-top:12px;}
#p15 .uc2-note{margin-top:10px;padding-top:14px;padding-bottom:14px;}

#p18 .p-lead{margin-top:10px;}
#p18 .assure-cols{margin-top:16px;}
#p18 .assure-panel{padding-top:18px;padding-bottom:18px;}
#p18 .clarify{margin-top:14px;}