/* Loaded last: reliable overrides for Contact and Plans */

/* Site-wide theme background (page underlayer) */
:root{--site-bg:#44BC86}
html,body{background-color:var(--site-bg)}

/* Contact: common form design */
.contact_title{color:#44bc86}
.contact_lead{margin-top:6px;color:#475467;font-size:14px}
.contact_form{position:relative;margin-top:20px}
.contact_card{background:#fff;border-radius:18px;box-shadow:6px 6px 0 rgba(0,0,0,.05);padding:30px;max-width:760px;margin:0 auto;position:relative;z-index:1}
@media screen and (min-width:1px) and (max-width:768px){
  .contact_card{padding:20px;max-width:100%}
}
.form_group{margin-bottom:16px}
.form_label{display:block;font-size:14px;font-weight:600;margin-bottom:8px}
.form_label .req{color:#44bc86;font-weight:700;margin-left:.5em}
.form_input,.form_textarea{width:100%;padding:12px 14px;border:1px solid #ddd;border-radius:10px;font-size:14px;background:#fff}
.form_textarea{resize:vertical}
.form_input:focus,.form_textarea:focus{outline:none;border-color:#44bc86;box-shadow:0 0 0 2px rgba(68,188,134,.12)}
.form_checkbox{font-size:14px}
.form_actions{text-align:center;margin-top:20px}

/* Plans: typical cards layout */
.plans{margin-top:60px;margin-bottom:120px}
.plans .heading_section .initial-p{color:#44BC86;font-weight:800;font-size:1.2em}
.plans_subtitle{font-size:18px;font-weight:800;margin:6px 0 12px;color:#0f172a}
@media screen and (max-width:768px){.plans_subtitle{font-size:16px;margin:4px 0 10px}}
.plans_container{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;align-items:stretch}
@media screen and (min-width:1px) and (max-width:768px){
  .plans_container{grid-template-columns:1fr;gap:16px}
}
.plan_card{margin:0;padding:30px;display:flex;flex-direction:column;text-align:center;border:1px solid #eee;border-radius:20px;box-shadow:0 4px 16px rgba(0,0,0,.06);transition:box-shadow .25s ease,transform .25s ease}
@media screen and (min-width:1px) and (max-width:768px){
  .plan_card{padding:20px}
}
.plan_header,.plan_price{margin-left:auto;margin-right:auto}
.plan_header{margin-bottom:18px}
.plan_name{font-size:22px;font-weight:800;letter-spacing:.01em}
@media screen and (min-width:1px) and (max-width:768px){.plan_name{font-size:20px}}
.plan_category{font-size:13px;color:#666;margin-top:4px}
.plan_features{flex:1}
.plan_features ul{display:inline-block;text-align:left}
.plan_features li{padding-left:22px;margin-bottom:10px;font-size:14px}
.plan_features li:before{left:0}
.plan_cta{margin-top:16px}
.plan_card:hover{transform:translateY(-2px);box-shadow:0 8px 28px rgba(0,0,0,.1)}

/* Plans brand accents */
.plan_card.plan_recommended{box-shadow:0 10px 30px rgba(0,0,0,.1);border-color:#44bc86}
.plan_recommended_badge{background-color:#44bc86;position:absolute;top:12px;left:12px;color:#fff;border-radius:999px;font-size:11px;padding:4px 10px;display:inline-block}
.price_range{color:#44bc86;font-size:30px;line-height:1.1}
@media screen and (min-width:1px) and (max-width:768px){.price_range{font-size:22px}}
.plan_features li:before{color:#44bc86}
.notes_item strong{color:#44bc86}

/* Additional refinements */
.plan_card{position:relative}
.plan_card-link{position:absolute;inset:0;border-radius:inherit;text-indent:-9999px}
.plans_footer-cta{margin-top:24px;text-align:center}
.plans_notes{font-size:12px;color:#667085;position:static;display:flex;justify-content:flex-end;margin:8px 0 8px;text-align:left}
.plans_notes .notes_item{max-width:560px}
.plans_notes .notes_item strong{font-size:12px}
.plan_features{min-height:160px}
@media screen and (max-width:768px){.plan_features{min-height:0}}

/* Plans refined overrides */
.plans_container{gap:28px}
@media screen and (max-width:1024px){.plans_container{grid-template-columns:repeat(2,1fr)}}
.plan_card{padding:28px;text-align:left;border-radius:16px;box-shadow:0 6px 18px rgba(0,0,0,.06);background:#fff}
.plan_card:hover{box-shadow:0 12px 32px rgba(0,0,0,.12)}
.plan_header,.plan_price{margin-left:0;margin-right:0}
.plan_header{margin-bottom:14px}
.plan_name{font-size:20px}
@media screen and (min-width:1px) and (max-width:768px){.plan_name{font-size:18px}}
.plan_category{color:#667085}
.plan_price{margin:8px 0 12px}
.price_range{line-height:1.1}
.price_range .price_currency,.price_range .price_suffix{font-size:.6em;vertical-align:baseline}
.price_range .price_amount{font-size:34px;font-weight:800}
@media screen and (min-width:1px) and (max-width:768px){.price_range .price_amount{font-size:24px}}
.plan_duration{font-size:13px;color:#475467;margin-bottom:12px}
.plan_features ul{display:block}
.plan_features li{position:relative;color:#111}
.plan_features li:before{content:"✓";left:0;color:#44bc86}
.plan_cta{margin-top:18px}
.plan_cta .button_small{display:block;width:100%;height:50px;border-radius:12px;background:#44bc86;color:#fff;box-shadow:none;font-size:15px;font-weight:700}
.plan_cta .button_small:hover{background:#3aa978}
.plan_card.plan_recommended{background:rgba(68,188,134,.06);padding-top:48px}
.plan_recommended_badge{color:#fff;border-radius:999px;font-size:11px;padding:4px 10px;display:inline-block}

/* Plans notes responsive: avoid overlap on small screens */
@media screen and (max-width:1024px){
  .plans_notes{position:static;margin:8px 0 0;justify-content:flex-start;text-align:left}
}

/* Points: tighten spacing between items */
.point_item+.point_item{margin-top:40px}
@media screen and (min-width:1px) and (max-width:768px){
  .point_item+.point_item{margin-top:20px}
}
.point_item:nth-of-type(3){margin-top:28px}
@media screen and (min-width:1px) and (max-width:768px){
  .point_item:nth-of-type(3){margin-top:18px}
}

/* Points: accent initial letters */
.accent-initial{color:#44bc86}

/* Hero heading word accent */
.accent-green{color:#44bc86;font-weight:800}

/* Hero (mobile) readability fixes */
@media screen and (max-width:768px){
  .kv_heading{font-size:clamp(26px,7vw,34px);line-height:1.35;letter-spacing:0;text-align:left;word-break:keep-all}
  .kv_heading br{display:none}
  .kv_statement{font-size:14px;line-height:1.9;letter-spacing:0;text-align:left;word-break:keep-all}
  .kv_statement br{display:none}
  /* Force hero to use photo background on small screens */
  .kv{background-image:linear-gradient(rgba(0,0,0,.35),rgba(0,0,0,.35)), url('Image_fx-34.jpg') !important; background-size:cover !important; background-position:center !important; background-repeat:no-repeat !important}
}

/* Compact layouts on small screens: Comparison and Plans */
@media screen and (max-width:768px){
  /* Base sizes still slightly compact; exact fit handled by autoscale.js */
  .comp_scroll{overflow-x:auto}
  .comp_cell{padding:10px 8px}
  .comp_case-title{font-size:16px}
  .comp_symbol{font-size:20px}
  .comp_cell p,.comp_cell p small{font-size:12px;line-height:1.5}
  .plans_container{gap:16px}
  .plan_card{padding:18px}
  .plan_name{font-size:16px}
  .price_range .price_amount{font-size:24px}
  .plan_features{min-height:0}
  .plans_footer-cta .button{width:100%;height:56px;font-size:16px}
}

/* Autoscale wrapper ensures transformed content does not collapse */
.js-autoscale{position:relative}
.js-autoscale > *{display:block; transform-origin:left top}

/* (Revert) Plans stays as grid on mobile */

/* Why section */
.why{padding:80px 0}
@media screen and (min-width:1px) and (max-width:768px){.why{padding:56px 0}}
/* Remove gradient; use solid brand color */
.why{background:#44BC86;margin-top:0;margin-bottom:0;padding-bottom:0;overflow:hidden;padding-top:8px}
@media screen and (max-width:768px){.why{padding-top:4px}}
/* Extra underlay to guarantee no white shows behind */
.why::before{content:"";position:absolute;inset:-2px;background:#44BC86;z-index:0;pointer-events:none}
/* remove legacy overlap hack */
.pain{margin-top:0}
/* Scroll-in animation: move only the SVG, keep background fixed */
.why_svg-container{position:relative;overflow:hidden;background:#44BC86;contain:paint;font-size:0}
/* Rise from bottom (SVG only) */
.why .why_svg{opacity:.5;transform:translate3d(0,100px,0);will-change:opacity,transform;backface-visibility:hidden}
.why.visible .why_svg{opacity:1;transform:translate3d(0,0,0);transition:opacity .45s ease-out,transform .9s cubic-bezier(.2,.8,.2,1)}
@media (prefers-reduced-motion: reduce){
  .why .why_svg{opacity:1;transform:none}
  .why.visible .why_svg{transition:none}
}
/* Prevent baseline gap below embedded SVG */
.why_svg-container{line-height:0;padding:0}
/* Ensure the SVG object fills container without inline gap */
.why_svg{display:block;width:100%;margin:0 auto;height:auto;border:0;background:transparent;vertical-align:bottom;backface-visibility:hidden;transform:translateZ(0)}
/* Guard against subpixel seams during motion */
.why_svg-container::before{content:"";position:absolute;inset:-1px;background:#44BC86;z-index:0}
.why_svg{position:relative;z-index:1}

/* (Re-enabled) WHY animation; keep containers static */
.why,.why_svg-container{transform:none;transition:none}
/* Narrower inner width for readability on dense content */
.why .l-inner{width:100%;max-width:none;padding-left:0;padding-right:0}
/* Header area (no extra background; section itself is green) */
.why_header{padding:0 0 8px;margin-bottom:24px}
.why_header .heading_section span{color:#fff}
.why_header .heading_section small{color:rgba(255,255,255,.85)}
.why_header .heading_section{margin:0}
.why .heading_section span{font-size:clamp(28px,5vw,44px)}
.why_subhead{margin-top:6px;color:rgba(255,255,255,.92);font-size:18px}
@media screen and (max-width:768px){.why_subhead{font-size:15px}}
.why_grid{display:grid;grid-template-columns:1fr;gap:32px;align-items:start}
@media screen and (max-width:1024px){.why_grid{grid-template-columns:1fr}}
@media screen and (max-width:768px){.why_grid{grid-template-columns:1fr;gap:20px}}
.why_subtitle{font-size:16px;font-weight:800;margin:0 0 6px;color:#fff}
.why_midlead{margin:0 0 14px;color:rgba(255,255,255,.9);font-size:13px}

/* Panels to lift content off green background */
.why_evolution,.why_adaptation{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:16px;padding:18px}
@media screen and (max-width:768px){.why_evolution,.why_adaptation{padding:14px}}
.why_stage-badge{display:inline-block;background:#44bc86;color:#fff;border-radius:999px;font-size:12px;font-weight:800;letter-spacing:.04em;padding:5px 10px}
.why_stage-badge.-ghost{background:rgba(68,188,134,.12);color:#198754}

/* Timeline */
.why_timeline{position:relative;margin:0;padding:6px 0 0 180px;list-style:none;border-left:none}
.why_rail{position:absolute;left:20px;top:30px;bottom:30px;width:140px;pointer-events:none}
.why_rail-svg{width:100%;height:100%;display:block}
.why_stage{position:relative;margin:0 0 20px}
.why_dot{display:none}
.why_stage-body{margin-left:0;transition:transform .2s ease}
.why_stage{min-height:88px}
.why_stage-body{display:grid;grid-template-columns:160px 1fr;gap:18px;align-items:center}
.why_timeline .why_stage:nth-child(2) .why_stage-body{transform:translateX(16px)}
.why_timeline .why_stage:nth-child(3) .why_stage-body{transform:translateX(32px)}
.why_timeline .why_stage:nth-child(4) .why_stage-body{transform:translateX(48px)}
.why_stage-title{font-size:14px;font-weight:700;margin-bottom:8px;color:#fff;position:relative}
.why_stage-title:after{content:"→";opacity:.6;margin-left:6px}
.why_chips{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:0}
.why_chips:before{content:"—";color:rgba(255,255,255,.85)}
.why_chip{display:inline-block;background:rgba(255,255,255,.96);border:1px solid rgba(255,255,255,.85);border-radius:999px;padding:6px 10px;font-size:12px;color:#0f172a}

/* Stage color accents (dot + title) */
.why_timeline .why_stage:nth-child(1) .why_dot{background:#f59e0b;box-shadow:0 0 0 4px rgba(245,158,11,.25)}
.why_timeline .why_stage:nth-child(1) .why_stage-title{color:#ffd7a1}
.why_timeline .why_stage:nth-child(2) .why_dot{background:#fb923c;box-shadow:0 0 0 4px rgba(251,146,60,.25)}
.why_timeline .why_stage:nth-child(2) .why_stage-title{color:#ffd4bb}
.why_timeline .why_stage:nth-child(3) .why_dot{background:#22c3ee;box-shadow:0 0 0 4px rgba(34,195,238,.25)}
.why_timeline .why_stage:nth-child(3) .why_stage-title{color:#b9ecfb}
.why_timeline .why_stage:nth-child(4) .why_dot{background:#1ea7d2;box-shadow:0 0 0 4px rgba(30,167,210,.25)}
.why_timeline .why_stage:nth-child(4) .why_stage-title{color:#b3e5f5}

/* Adaptation card */
/* Adaptation: cases list */
.why_cases{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media screen and (max-width:1024px){.why_cases{grid-template-columns:1fr}}
.why_case{background:#fff;border:1px solid #eef3f0;border-radius:14px;box-shadow:0 6px 18px rgba(0,0,0,.04);padding:14px 16px;position:relative}
.why_case:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;border-radius:14px 0 0 14px;background:#44bc86}
.why_case-title{font-weight:800;color:#0f172a;margin-bottom:4px}
.why_case-desc{color:#475467;font-size:14px}

/* Callout */
/* callout removed per spec */

/* Comparison: refined table design */
.comparison_table{position:relative;border:1px solid #eee;border-radius:12px;overflow-x:auto;overflow-y:hidden}
.comparison_row{display:grid;grid-template-columns:200px repeat(5,1fr)}
.comparison_cell{padding:14px 16px;border-bottom:1px solid #eee;font-size:14px;line-height:1.6;color:#111}
.comparison_header{position:sticky;top:0;z-index:1}
.comparison_header .comparison_cell{background:#fafafa;font-weight:700;letter-spacing:.2px}
.comparison_row:not(.comparison_header):nth-child(even) .comparison_cell{background:#fbfbfb}
.comparison_row:hover .comparison_cell{background:#f7f9f8}
.comparison_row .comparison_cell.comparison_highlight{background:rgba(68,188,134,.08);font-weight:600;box-shadow:inset 3px 0 0 #44bc86;color:#0f172a}
.comparison_row .comparison_cell:first-child{background:#f7f9f8;font-weight:600;font-size:15px;text-align:left;border-right:1px solid #e6e6e6;position:sticky;left:0;z-index:1;color:#0f172a}
.comparison_row:hover .comparison_cell:first-child{background:#f3f6f5}
.comparison_header .comparison_cell:first-child{visibility:hidden}
.comparison_row .comparison_metric{font-weight:600}
.comparison_row .comparison_metric small{display:block;color:#667085;margin-top:4px;font-size:12px}
.comparison_header .comparison_cell.comparison_highlight{position:relative}
.comparison_header .comparison_cell.comparison_highlight:after{content:"推奨";display:inline-block;margin-left:8px;background:#44bc86;color:#fff;font-size:11px;font-weight:700;padding:2px 6px;border-radius:999px;vertical-align:middle}

/* Responsive cards for comparison */
@media screen and (min-width:1px) and (max-width:768px){
  .comparison_table{border:none;border-radius:0}
  .comparison_header{display:none}
  .comparison_row{grid-template-columns:1fr;border:1px solid #eee;border-radius:12px;margin-bottom:12px;overflow:hidden}
  .comparison_row .comparison_cell{border-bottom:1px solid #eee}
  .comparison_row .comparison_cell:last-child{border-bottom:none}
  .comparison_row .comparison_cell:first-child{background:#f9fafb;font-weight:700}
  .comparison_row .comparison_cell.comparison_highlight{background:rgba(68,188,134,.08);box-shadow:none}
  .comparison_row .comparison_cell:nth-child(2),
  .comparison_row .comparison_cell:nth-child(3),
  .comparison_row .comparison_cell:nth-child(4),
  .comparison_row .comparison_cell:nth-child(5),
  .comparison_row .comparison_cell:nth-child(6){
    display:grid;grid-template-columns:96px 1fr;align-items:start;gap:10px
  }
  .comparison_row .comparison_cell:nth-child(2)::before{content:"FLEDGE";font-weight:700;color:#222}
  .comparison_row .comparison_cell:nth-child(3)::before{content:"ノーコード自作";font-weight:700;color:#222}
  .comparison_row .comparison_cell:nth-child(4)::before{content:"CMSでの自作";font-weight:700;color:#222}
  .comparison_row .comparison_cell:nth-child(5)::before{content:"格安サービスへの外注";font-weight:700;color:#222}
  .comparison_row .comparison_cell:nth-child(6)::before{content:"コードベースサービスへの外注";font-weight:700;color:#222}
}

/* Tighten gap between STEPs and Contact */
.steps{margin-bottom:40px}
@media screen and (min-width:1px) and (max-width:768px){
  .steps{margin-bottom:12px}
}
.contact{padding-top:55px}
@media screen and (min-width:1px) and (max-width:768px){
  .contact{padding-top:20px}
}
/* Pain section overrides for 2-column layout */
.pains_item:nth-of-type(2){top:0}
@media screen and (max-width:768px){
  .pains_item:nth-of-type(2){top:0;margin-top:20px}
}

/* Anti-seam: images/SVGs flush with containers */
.point_item-image{line-height:0}
.point_item-image img{display:block;border:0;background:transparent;vertical-align:bottom}
.point_item-image svg{display:block}
.why_svg{display:block}

/* Pain & Solution: unified image section */
.pain-solution{background:#EDE9E6;padding:0;margin:0}
.pain-solution_inner{line-height:0}
.pain-solution_img{display:block;width:100%;height:auto;border:0;background:transparent;vertical-align:bottom}
.anchor_fix{position:relative;top:-80px;display:block;height:0;width:0;overflow:hidden}

/* New Pain section: full-bleed SVG */
.pain{background:transparent !important;margin:0 !important;padding:0 !important;overflow:hidden}
.pain .l-inner{width:100%;max-width:none;padding-left:0;padding-right:0}
.pain_svg-container{line-height:0;padding:0}
.pain_svg{display:block;width:100%;height:auto;border:0;background:transparent;vertical-align:bottom}

/* Solution section: full-bleed SVG */
.solution{background:#fff;margin:0;padding:0;overflow:hidden;position:relative}
.solution .l-inner{width:100%;max-width:none;padding-left:0;padding-right:0}
.solution_svg-container{line-height:0;padding:0}
.solution_svg{display:block;width:100%;height:auto;border:0;background:transparent;vertical-align:bottom}

/* Remove all vertical gaps between sections */
.kv,.why,.pain,.solution,.comparison,.plans,.steps,.contact,.footer{
  margin:0 !important;
  padding-top:0 !important;
  padding-bottom:0 !important;
  overflow:hidden;
}
.kv_scroll{display:none}

/* Narrow content width to ~75% for selected sections */
.comparison .l-inner,.plans .l-inner,.steps .l-inner{
  width:70vw;
  max-width:1200px;
  padding-left:0;
  padding-right:0;
  margin-left:auto;
  margin-right:auto;
}
@media screen and (max-width:768px){
  .comparison .l-inner,.plans .l-inner,.steps .l-inner{width:92vw}
}

/* Top spacing inside sections (not between) */
.comparison{padding-top:150px !important}
.plans{padding-top:150px !important}
.steps{padding-top:150px !important}
.contact{padding-top:150px !important}

/* Comparison section brand background */
.comparison{background:#fff;position:relative}
/* Anti-seam underlay to mask page background */
.solution::before,.comparison::before{content:"";position:absolute;inset:-1px;background:#fff;pointer-events:none;z-index:0}

/* Alt comparison grid (3 options × case column) */
.comp_scroll{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
.comp_alt{--case-col:clamp(170px,18vw,220px);--opt-col:clamp(160px,16vw,220px);display:grid;grid-template-columns:var(--case-col) repeat(5,var(--opt-col));border-collapse:separate;border-spacing:0;border-radius:18px;position:relative;width:max-content}
.comp_row{display:contents}
.comp_cell{background:#fff;border:1px solid #d9d9d9;padding:14px 12px}
.comparison .heading_section .initial-c{color:#44BC86;font-weight:800;font-size:1.2em}
.comparison_lead{margin:8px 0 18px}
.comparison_title{font-size:18px;font-weight:800;margin:0 0 6px;color:#0f172a}
.comparison_desc{margin:0;color:#475467;font-size:14px}
.comp_case-head{background:#fff;border:none}
.comp_head-gray{background:#9c9c9c;color:#fff;font-weight:800;text-align:center;border-color:#9c9c9c}
.comp_head-accent{background:#44BC86;color:#fff;font-weight:800;text-align:center;border-color:#44BC86;border-top-right-radius:16px}
.comp_row.comp_head .comp_cell{display:flex;align-items:center;justify-content:center}
.comp_head .comp_head-gray:first-of-type{border-top-left-radius:16px}
.comp_case{background:#23c6a3;color:#fff;border-color:#23c6a3;display:flex;flex-direction:column;justify-content:center;gap:4px}
.comp_case-num{font-size:12px;font-weight:800;opacity:.9}
.comp_case-title{font-size:18px;font-weight:800}
.comp_cell-body{background:#fff}
.comp_cell-body{min-height:48px}
.comp_cell-accent{background:rgba(68,188,134,.10)}
.comp_cell-accent .comp_symbol{color:#44BC86}
.comp_symbol.-bad{color:#dc2626}
.comp_symbol{font-size:24px;font-weight:800;text-align:center;margin:0 0 2px;color:#111}
.comp_icon{width:28px;height:28px;margin:0 auto 10px;border:3px solid #777;border-radius:50%}
.comp_icon.-triangle{width:0;height:0;border:0;border-left:16px solid transparent;border-right:16px solid transparent;border-bottom:28px solid #777;border-radius:0}
.comp_icon.-question{position:relative;border-radius:0;border:none}
.comp_icon.-question:before{content:"?";display:block;font-weight:800;font-size:26px;line-height:1;color:#777;text-align:center}
.comp_icon.-accent{border-color:#f59e0b}
.comp_divider{height:1px;background:repeating-linear-gradient(90deg,#cfcfcf 0,#cfcfcf 8px,transparent 8px,transparent 16px);margin:2px 0}
.comp_cell p{margin:0;color:#222;line-height:1.6}
.comp_cell p small{color:#555}

@media screen and (max-width:1024px){
  /* Keep table as table; enable horizontal scroll on small screens */
  .comp_alt{--case-col:220px;--opt-col:200px;grid-template-columns:var(--case-col) repeat(5,var(--opt-col))}
  .comp_scroll{scroll-snap-type:x proximity}
  .comp_head-gray,.comp_head-accent{border-radius:0}
  .comp_row{display:contents}
  .comp_cell{border-left:none;border-right:none}
  .comp_case{border-top:none}
}

/* Sticky header and first column for scroll usability */
.comp_row.comp_head .comp_cell{position:sticky;top:0;z-index:2}
.comp_case,.comp_case-head{position:sticky;left:0;z-index:3}

/* Scroll hint for narrow screens */
@media screen and (max-width:768px){
  .comp_scroll{position:relative}
  .comp_scroll::after{content:"横にスワイプ";position:absolute;right:8px;top:-26px;font-size:12px;color:#475467;background:rgba(255,255,255,.9);border:1px solid #e5e7eb;border-radius:999px;padding:4px 8px;box-shadow:0 2px 6px rgba(0,0,0,.05)}
}

/* Desktop: show entire table without horizontal scroll */
@media screen and (min-width:1024px){
  .comp_scroll{overflow-x:visible}
  .comp_scroll::after{content:none}
  .comp_alt{--case-col:200px;grid-template-columns:var(--case-col) repeat(5,1fr);width:100%;min-width:0}
  .comp_row.comp_head .comp_cell{min-height:64px}
}

/* Keep AXIS sticky even on ultra-narrow */
/* Plans and Steps section background */
/* Plans/Steps/Contact: white background and white separators */
.plans{background:#fff;margin:0;padding:60px 0 120px}
.steps{background:#fff;margin:0;padding:64px 0}

/* Contact section background */
.contact{background:#fff;margin:0}
.contact:before{display:none}

/* Pain: hero and layout refresh */
.pain{background:#EDE9E6 !important;padding:88px 0 80px;margin-top:0}
@media screen and (max-width:1024px){.pain{padding:72px 0 64px}}
.pains_pain{background:none !important}
.pain .heading_section{display:none}
.pains_intro{display:none}
.hl-green{color:#44BC86}
.pain_header{margin:0 0 18px}
.pain_heading{font-size:52px;line-height:1.25;letter-spacing:.2px;color:#111;margin:0 0 10px}
@media screen and (max-width:1024px){.pain_heading{font-size:44px}}
@media screen and (max-width:768px){.pain_heading{font-size:30px}}
.pain_lead{font-size:18px;color:#333;line-height:1.8;margin:0 0 12px}
@media screen and (max-width:768px){.pain_lead{font-size:16px}}
.pain_rule{height:1px;background:rgba(0,0,0,.15);width:40%;min-width:180px}

/* Two-column body */
.pain_body{display:grid;grid-template-columns:1.2fr 1fr;gap:40px;align-items:start}
@media screen and (max-width:1024px){.pain_body{grid-template-columns:1fr;gap:24px}}
.pain_left{display:flex;flex-direction:column;gap:18px}
.pain_statement{font-weight:700;color:#222}
.pain_label-card{border:1px solid rgba(17,17,17,.6);border-radius:12px;padding:20px 24px;text-align:center;background:#fff}
.pain_label-card span{display:block;font-weight:800;color:#111;font-size:44px}
@media screen and (max-width:768px){.pain_label-card span{font-size:28px}}

/* Right illustration */
.pain_right{position:relative;justify-self:end;max-width:520px;width:100%}
@media screen and (max-width:1024px){.pain_right{justify-self:center;max-width:440px}}
.pain_illustration{background:transparent;border:none}
.pain_illust-svg{display:block;width:100%;height:auto}

/* Venn block */
.pains_venn{display:flex;align-items:center;justify-content:center;margin:10px 0 26px}
.pains_venn-svg{width:min(640px,92%);height:auto;display:block}

/* Cards: grid layout override */
.pains_list{display:grid !important;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:10px !important;padding-bottom:60px !important}
@media screen and (max-width:1024px){.pains_list{grid-template-columns:repeat(2,1fr)}}
@media screen and (max-width:768px){.pains_list{grid-template-columns:1fr;gap:16px}}
.pains_item{width:auto !important;top:0 !important}
.pains_item:nth-of-type(2),.pains_item:nth-of-type(3){top:0 !important}
.pains_item{box-shadow:0 6px 18px rgba(0,0,0,.06);border-radius:18px}
.pains_item-heading{background-image:linear-gradient(to top,#f5ff00 0,#f5ff00 40%,transparent 40%) !important;font-size:20px}
@media screen and (max-width:768px){.pains_item-heading{font-size:18px}}
.pains_item-text{font-size:14px;line-height:1.9}

/* In-view motion: subtle, content-only */
.pain [data-trigger]{opacity:0;transform:translateY(12px)}
.pain .visible{opacity:1;transform:translateY(0);transition:opacity .45s ease,transform .5s ease}
@media (prefers-reduced-motion: reduce){
  .pain [data-trigger]{opacity:1;transform:none}
  .pain .visible{transition:none}
}