/* Sales pages · OYAG services */
.sales-page{background:#030914;color:#eef5ff}
.sales-page .topbar{background:rgba(3,9,20,.94)}
.sales-hero{max-width:1240px;margin:0 auto;padding:70px 24px 54px;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr);gap:48px;align-items:center}
.sales-hero h1{font-size:clamp(2.55rem,5.2vw,5.1rem);line-height:.96;letter-spacing:-.055em;margin:10px 0 20px;text-wrap:balance}
.sales-hero .lead{max-width:760px;color:#afc0d2;font-size:1.06rem;line-height:1.72}
.offer-pill{display:inline-flex;align-items:center;gap:8px;padding:8px 11px;border-radius:999px;border:1px solid rgba(46,167,255,.34);background:rgba(46,167,255,.08);color:#82d0ff;font-size:.72rem;font-weight:950;letter-spacing:.1em;text-transform:uppercase}
.sales-price{display:flex;align-items:end;gap:14px;flex-wrap:wrap;margin:24px 0 10px}
.sales-price del{color:#7f92a6;font-size:1rem}
.sales-price strong{font-size:clamp(2.4rem,5vw,4.2rem);line-height:.95;color:#f4c960;letter-spacing:-.045em}
.sales-price small{color:#9fb2c5;font-weight:800;padding-bottom:5px}
.sales-scarcity{margin:12px 0 0;padding:11px 13px;border-radius:12px;background:rgba(244,201,96,.08);border:1px solid rgba(244,201,96,.2);color:#f4dfa0;font-size:.84rem;line-height:1.5}
.sales-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}
.sales-visual{position:relative;min-height:520px;border-radius:28px;overflow:hidden;border:1px solid rgba(93,151,211,.22);background:#071522;box-shadow:0 32px 90px rgba(0,0,0,.34)}
.sales-visual>img{width:100%;height:100%;min-height:520px;object-fit:cover;display:block;filter:saturate(.88) contrast(1.05) brightness(.64)}
.sales-visual:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 26%,rgba(3,9,20,.38) 58%,rgba(3,9,20,.92))}
.visual-overlay{position:absolute;left:22px;right:22px;bottom:22px;z-index:2;padding:20px;border-radius:18px;border:1px solid rgba(255,255,255,.14);background:rgba(3,12,23,.72);backdrop-filter:blur(10px)}
.visual-overlay span,.visual-overlay strong{display:block}.visual-overlay span{color:#73c8ff;font-size:.72rem;font-weight:900;text-transform:uppercase;letter-spacing:.1em}.visual-overlay strong{font-size:1.35rem;margin-top:5px}
.sales-section{max-width:1240px;margin:0 auto;padding:72px 24px}
.sales-section-heading{max-width:780px;margin-bottom:32px}.sales-section-heading h2{font-size:clamp(2rem,4vw,3.5rem);line-height:1.04;letter-spacing:-.04em;margin:8px 0 12px;text-wrap:balance}.sales-section-heading p{color:#9fb2c5;line-height:1.68}
.sales-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.sales-card{padding:24px;border-radius:18px;border:1px solid rgba(93,151,211,.18);background:#091728;box-shadow:0 18px 50px rgba(0,0,0,.2)}.sales-card .num{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,#1677ff,#7a5cff);font-weight:950}.sales-card h3{margin:16px 0 8px;font-size:1.22rem}.sales-card p{margin:0;color:#9fb2c5;line-height:1.62}
.sales-feature-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.sales-feature{padding:22px;border-radius:18px;border:1px solid rgba(93,151,211,.18);background:linear-gradient(145deg,#091728,#0c1d30)}.sales-feature b{display:block;font-size:1.08rem;margin-bottom:6px}.sales-feature p{margin:0;color:#a7b9ca;line-height:1.58}
.metric-shell{display:grid;grid-template-columns:.8fr 1.2fr;gap:18px;align-items:stretch}.metric-panel,.metric-copy{padding:26px;border-radius:22px;border:1px solid rgba(93,151,211,.18);background:#081525}.metric-copy h3{font-size:1.8rem;margin:8px 0 12px}.metric-copy p{color:#9fb2c5;line-height:1.65}.metric-note{display:block;margin-top:14px;color:#7f93a6;font-size:.77rem}
.metric-row{display:grid;grid-template-columns:120px 1fr 50px;align-items:center;gap:10px;margin:18px 0}.metric-row span{font-size:.78rem;color:#b7c8d7}.metric-row b{font-size:.75rem;text-align:right;color:#7ecbff}.metric-track{height:10px;border-radius:99px;background:#10283f;overflow:hidden}.metric-fill{height:100%;width:var(--w);border-radius:99px;background:linear-gradient(90deg,#1677ff,#7a5cff,#2ea7ff);transform-origin:left;animation:salesGrow 1.2s cubic-bezier(.2,.75,.2,1) both}
@keyframes salesGrow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.sales-process{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.sales-process article{padding:22px;border-radius:18px;background:#091728;border:1px solid rgba(93,151,211,.18)}.sales-process span{color:#f4c960;font-weight:950}.sales-process h3{margin:10px 0 8px}.sales-process p{margin:0;color:#9fb2c5;line-height:1.55}
.offer-block{max-width:1180px;margin:20px auto 72px;padding:34px;border-radius:26px;border:1px solid rgba(244,201,96,.25);background:radial-gradient(circle at 92% 8%,rgba(122,92,255,.18),transparent 30%),linear-gradient(145deg,#071522,#0a1d31);display:grid;grid-template-columns:1.1fr .9fr;gap:30px;align-items:center}.offer-block h2{font-size:clamp(2rem,4vw,3.5rem);line-height:1.04;margin:8px 0 14px}.offer-block p{color:#a9bbcc;line-height:1.65}.offer-box{padding:24px;border-radius:20px;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.11)}.offer-box .sales-price{margin-top:8px}.offer-box ul{padding-left:18px;color:#c9d6e2;line-height:1.7}
.sales-faq{display:grid;gap:10px}.sales-faq details{border:1px solid rgba(93,151,211,.18);border-radius:15px;background:#081525;padding:17px 19px}.sales-faq summary{cursor:pointer;font-weight:900}.sales-faq p{color:#9fb2c5;line-height:1.62}
.sales-final{max-width:1180px;margin:0 auto 80px;padding:46px 26px;text-align:center;border-radius:28px;background:linear-gradient(135deg,#0b3154,#221d57);border:1px solid rgba(82,159,229,.25)}.sales-final h2{font-size:clamp(2.1rem,4vw,3.7rem);margin:8px auto 14px;max-width:850px;line-height:1.03}.sales-final p{max-width:720px;margin:0 auto;color:#d1dfeb;line-height:1.65}.sales-final .sales-actions{justify-content:center}
.service-card-image{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:14px;margin:-4px 0 16px;filter:saturate(.9) contrast(1.03)}
.service-price-inline{display:flex;gap:10px;align-items:baseline;flex-wrap:wrap;margin:8px 0 14px}.service-price-inline del{color:var(--muted)}.service-price-inline strong{font-size:1.45rem;color:var(--gold)}.service-price-inline small{color:var(--muted);font-weight:800}
.service-offer-note{display:block;color:#f0d989;font-size:.74rem;line-height:1.45;margin-bottom:13px}
@media(max-width:930px){.sales-hero{grid-template-columns:1fr}.sales-visual{min-height:420px}.sales-visual>img{min-height:420px}.sales-grid{grid-template-columns:1fr}.sales-feature-grid{grid-template-columns:1fr}.metric-shell{grid-template-columns:1fr}.sales-process{grid-template-columns:1fr 1fr}.offer-block{grid-template-columns:1fr;margin-left:18px;margin-right:18px}}
@media(max-width:620px){.sales-hero{padding-top:38px}.sales-visual,.sales-visual>img{min-height:330px}.sales-process{grid-template-columns:1fr}.metric-row{grid-template-columns:95px 1fr 38px}.offer-block{padding:24px 18px}.sales-actions{display:grid}.sales-actions .button{width:100%}}
@media(prefers-reduced-motion:reduce){.metric-fill{animation:none}}


/* Four-service commercial grids */
.service-cards{grid-template-columns:repeat(4,1fr)}
.content-hub .content-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:1080px){.service-cards{grid-template-columns:repeat(2,1fr)}}
@media(max-width:800px){.service-cards,.content-hub .content-cards{grid-template-columns:1fr}}


/* Sales pages mobile hardening · 2026-09-20 */
@media(max-width:760px){
  .sales-hero{padding:38px 16px 34px;gap:26px}
  .sales-hero h1{font-size:clamp(2rem,10.4vw,2.65rem);line-height:1.01;letter-spacing:-.045em}
  .sales-hero .lead{font-size:.98rem;line-height:1.58}
  .sales-price{gap:8px 12px;margin-top:20px}
  .sales-price strong{font-size:clamp(2rem,11vw,2.8rem)}
  .sales-price small{padding-bottom:2px}
  .sales-actions{display:grid;grid-template-columns:1fr;width:100%}
  .sales-actions .button{width:100%;min-height:48px}
  .sales-visual,.sales-visual>img{min-height:290px}
  .sales-visual{border-radius:20px}
  .visual-overlay{left:12px;right:12px;bottom:12px;padding:15px}
  .visual-overlay strong{font-size:1.1rem}
  .sales-section{padding:52px 16px}
  .sales-section-heading{margin-bottom:24px}
  .sales-section-heading h2{font-size:clamp(1.8rem,8.7vw,2.45rem)}
  .sales-grid,.sales-feature-grid,.metric-shell,.sales-process{grid-template-columns:minmax(0,1fr)}
  .sales-card,.sales-feature,.metric-panel,.metric-copy,.sales-process article{padding:18px}
  .metric-row{grid-template-columns:88px minmax(0,1fr) 34px;gap:8px}
  .metric-row span{font-size:.7rem}
  .offer-block{margin:8px 12px 56px;padding:22px 16px;border-radius:20px;grid-template-columns:1fr}
  .offer-block h2{font-size:clamp(1.9rem,8.7vw,2.5rem)}
  .offer-box{padding:18px}
  .sales-faq details{padding:15px 16px}
  .sales-final{margin:0 12px 58px;padding:34px 16px;border-radius:20px}
  .sales-final h2{font-size:clamp(1.9rem,8.7vw,2.55rem)}
  .service-card-image{aspect-ratio:16/10}
}
@media(max-width:380px){
  .sales-hero,.sales-section{padding-left:13px;padding-right:13px}
  .sales-visual,.sales-visual>img{min-height:260px}
  .metric-row{grid-template-columns:76px minmax(0,1fr) 30px}
}


/* Sales visual polish · 2026-09-20 */
.sales-hero{
  background:
    radial-gradient(circle at 8% 18%,rgba(46,167,255,.055),transparent 26%),
    radial-gradient(circle at 92% 15%,rgba(122,92,255,.07),transparent 30%)
}
.sales-visual{
  box-shadow:0 34px 100px rgba(0,0,0,.38),0 0 0 1px rgba(255,255,255,.015) inset
}
.sales-card,.sales-feature,.metric-panel,.metric-copy,.sales-process article,.offer-box{
  background:
    linear-gradient(145deg,rgba(11,30,50,.88),rgba(7,20,35,.92));
  backdrop-filter:blur(10px)
}
.metric-fill{box-shadow:0 0 24px rgba(46,167,255,.24)}
.offer-block{
  box-shadow:0 34px 100px rgba(0,0,0,.28);
  overflow:hidden;position:relative
}
.offer-block:before{
  content:"";position:absolute;width:360px;height:360px;right:-150px;top:-190px;border-radius:50%;
  background:radial-gradient(circle,rgba(46,167,255,.12),transparent 68%);pointer-events:none
}
.sales-final{
  box-shadow:0 34px 90px rgba(0,0,0,.3);
  position:relative;overflow:hidden
}
.sales-final:before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(circle at 50% 0,rgba(255,255,255,.09),transparent 42%)
}


/* Benefits, scope and CTA emphasis · 2026-09-20 */
.sales-benefit-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px
}
.sales-benefit{
  display:grid;
  grid-template-columns:42px minmax(0,1fr);
  gap:14px;
  align-items:start;
  padding:20px;
  border:1px solid rgba(93,151,211,.18);
  border-radius:18px;
  background:linear-gradient(145deg,rgba(9,23,40,.92),rgba(12,31,52,.86));
  box-shadow:0 16px 46px rgba(0,0,0,.16);
  transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease
}
.sales-benefit:hover{
  transform:translateY(-4px);
  border-color:rgba(46,167,255,.38);
  box-shadow:0 24px 64px rgba(0,0,0,.24)
}
.benefit-check{
  width:38px;height:38px;border-radius:12px;
  display:grid;place-items:center;
  background:linear-gradient(135deg,#1677ff,#7a5cff);
  color:#fff;font-weight:950;
  box-shadow:0 10px 26px rgba(46,167,255,.2)
}
.sales-benefit h3{margin:1px 0 6px;font-size:1.06rem}
.sales-benefit p{margin:0;color:#a8bbcc;line-height:1.58}

.sales-included{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px
}
.included-item{
  display:grid;
  grid-template-columns:42px minmax(0,1fr);
  gap:12px;
  align-items:center;
  padding:15px 17px;
  border:1px solid rgba(93,151,211,.16);
  border-radius:14px;
  background:rgba(8,21,37,.82)
}
.included-item>span{
  color:#82d0ff;
  font-size:.72rem;
  font-weight:950;
  letter-spacing:.08em
}
.included-item p{margin:0;color:#d0dce6;line-height:1.48;font-size:.9rem}
.scope-note{
  margin-top:16px;
  padding:15px 17px;
  border-radius:14px;
  border:1px solid rgba(244,201,96,.22);
  background:rgba(244,201,96,.065);
  color:#dacb9d;
  line-height:1.55;
  font-size:.84rem
}
.scope-note strong{color:#f4dfa0}

.sales-actions .button.primary,
.offer-box .button.primary,
.sales-final .button.primary{
  min-height:50px;
  box-shadow:0 14px 34px rgba(22,119,255,.28),0 0 0 1px rgba(255,255,255,.06) inset;
  animation:salesCtaGlow 2.8s ease-in-out infinite
}
.sales-actions .button.secondary,
.offer-box .button.secondary,
.sales-final .button.secondary{
  min-height:50px;
  border-color:rgba(126,203,255,.28);
  background:rgba(10,29,48,.9)
}
.sales-actions .button.primary:hover,
.offer-box .button.primary:hover,
.sales-final .button.primary:hover{
  transform:translateY(-3px) scale(1.015);
  box-shadow:0 20px 46px rgba(46,167,255,.36),0 0 0 1px rgba(255,255,255,.08) inset
}
@keyframes salesCtaGlow{
  0%,100%{box-shadow:0 14px 34px rgba(22,119,255,.24),0 0 0 1px rgba(255,255,255,.05) inset}
  50%{box-shadow:0 18px 44px rgba(122,92,255,.34),0 0 0 1px rgba(255,255,255,.08) inset}
}
@media(max-width:760px){
  .sales-benefit-grid,.sales-included{grid-template-columns:minmax(0,1fr)}
  .sales-benefit{padding:17px;grid-template-columns:38px minmax(0,1fr)}
  .benefit-check{width:34px;height:34px}
  .included-item{padding:14px}
  .sales-actions .button.primary,
  .sales-actions .button.secondary,
  .offer-box .button.primary,
  .offer-box .button.secondary,
  .sales-final .button.primary,
  .sales-final .button.secondary{min-height:52px}
}
@media(hover:none),(pointer:coarse){
  .sales-benefit:hover{transform:none}
  .sales-actions .button.primary:hover,
  .offer-box .button.primary:hover,
  .sales-final .button.primary:hover{transform:none}
}
@media(prefers-reduced-motion:reduce){
  .sales-actions .button.primary,
  .offer-box .button.primary,
  .sales-final .button.primary{animation:none}
}


/* Copy funnel, final price and animated SVG · 2026-09-20 */
.sales-fit-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px
}
.sales-fit-grid article{
  position:relative;
  padding:22px;
  border:1px solid rgba(93,151,211,.18);
  border-radius:18px;
  background:linear-gradient(145deg,rgba(9,23,40,.92),rgba(12,31,52,.86));
  box-shadow:0 16px 46px rgba(0,0,0,.16)
}
.sales-fit-grid article>span{
  display:inline-grid;place-items:center;
  width:36px;height:36px;border-radius:11px;
  color:#8bd1ff;font-size:.7rem;font-weight:950;
  background:rgba(46,167,255,.09);
  border:1px solid rgba(46,167,255,.18)
}
.sales-fit-grid h3{margin:15px 0 7px;font-size:1.08rem}
.sales-fit-grid p{margin:0;color:#a8bbcc;line-height:1.58}

.sales-svg-shell{
  position:relative;
  padding:22px 22px 16px;
  border:1px solid rgba(93,151,211,.18);
  border-radius:24px;
  background:
    radial-gradient(circle at 80% 10%,rgba(122,92,255,.09),transparent 26%),
    linear-gradient(145deg,rgba(7,20,35,.96),rgba(11,29,49,.92));
  box-shadow:0 26px 78px rgba(0,0,0,.24);
  overflow:hidden
}
.sales-svg-chart{
  display:block;
  width:100%;
  height:auto;
  min-height:300px
}
.svg-grid line{
  stroke:rgba(134,181,220,.11);
  stroke-width:1
}
.svg-line{
  stroke-dasharray:1;
  stroke-dashoffset:1
}
.svg-area{
  opacity:0;
  transform-origin:center bottom
}
.svg-points circle{
  fill:#071522;
  stroke:#7ecbff;
  stroke-width:5;
  opacity:0;
  transform-box:fill-box;
  transform-origin:center
}
.svg-labels text{
  fill:#a9bed0;
  font:700 18px/1 system-ui,-apple-system,Segoe UI,sans-serif;
  letter-spacing:.015em
}
.sales-svg-shell.is-visible .svg-line{
  animation:svgDraw 1.55s cubic-bezier(.2,.75,.2,1) forwards
}
.sales-svg-shell.is-visible .svg-area{
  animation:svgAreaIn 1.1s .35s ease forwards
}
.sales-svg-shell.is-visible .svg-points circle{
  animation:svgPointIn .5s ease forwards,svgPulse 2.7s 1.3s ease-in-out infinite
}
.sales-svg-shell.is-visible .svg-points circle:nth-child(2){animation-delay:.3s,1.6s}
.sales-svg-shell.is-visible .svg-points circle:nth-child(3){animation-delay:.6s,1.9s}
.sales-svg-shell.is-visible .svg-points circle:nth-child(4){animation-delay:.9s,2.2s}
.svg-legend{
  display:flex;
  justify-content:space-between;
  gap:16px;
  align-items:center;
  padding:10px 4px 2px;
  color:#adc1d1
}
.svg-legend span{display:flex;gap:8px;align-items:center;font-size:.8rem;font-weight:850}
.svg-legend i{width:28px;height:4px;border-radius:99px;background:linear-gradient(90deg,#1677ff,#7a5cff,#2ea7ff)}
.svg-legend small{max-width:620px;color:#73899c;font-size:.72rem;line-height:1.45;text-align:right}
@keyframes svgDraw{to{stroke-dashoffset:0}}
@keyframes svgAreaIn{from{opacity:0;transform:scaleY(.84)}to{opacity:1;transform:scaleY(1)}}
@keyframes svgPointIn{from{opacity:0;transform:scale(.2)}to{opacity:1;transform:scale(1)}}
@keyframes svgPulse{0%,100%{filter:drop-shadow(0 0 0 rgba(46,167,255,0))}50%{filter:drop-shadow(0 0 10px rgba(46,167,255,.65))}}

.sales-final-offer{
  max-width:1180px;
  margin:10px auto 80px;
  padding:44px;
  border-radius:30px;
  border:1px solid rgba(244,201,96,.25);
  background:
    radial-gradient(circle at 86% 4%,rgba(122,92,255,.18),transparent 30%),
    radial-gradient(circle at 14% 100%,rgba(46,167,255,.12),transparent 34%),
    linear-gradient(145deg,#071522,#0b2137);
  box-shadow:0 34px 100px rgba(0,0,0,.32);
  overflow:hidden;
  position:relative
}
.sales-final-offer:after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.025) 50%,transparent 70%)
}
.final-offer-copy{position:relative;z-index:1;max-width:880px;margin:0 auto;text-align:center}
.final-offer-copy h2{
  margin:8px auto 16px;
  max-width:900px;
  font-size:clamp(2.2rem,4.6vw,4rem);
  line-height:1.02;
  letter-spacing:-.045em;
  text-wrap:balance
}
.final-offer-copy>p{max-width:760px;margin:0 auto;color:#afc0d2;line-height:1.68}
.final-offer-value{
  display:flex;
  justify-content:center;
  align-items:end;
  gap:28px;
  flex-wrap:wrap;
  margin:30px auto 18px
}
.final-offer-value>div{display:grid;gap:6px}
.final-offer-value span{
  color:#90a6b8;
  font-size:.7rem;
  font-weight:950;
  letter-spacing:.09em;
  text-transform:uppercase
}
.final-offer-value del{color:#8293a4;font-size:1.2rem}
.final-offer-price strong{
  font-size:clamp(3rem,7vw,5.2rem);
  line-height:.9;
  color:#f4c960;
  letter-spacing:-.055em;
  text-shadow:0 0 34px rgba(244,201,96,.12)
}
.final-offer-price small{
  color:#c6d5df;
  font-size:1rem;
  font-weight:850
}
.final-offer-condition{
  max-width:760px;
  margin:0 auto 14px;
  padding:14px 16px;
  border-radius:14px;
  background:rgba(255,255,255,.035);
  border:1px solid rgba(255,255,255,.08);
  color:#c3d1dc;
  line-height:1.55;
  font-size:.84rem
}
.final-offer-actions{justify-content:center!important;margin-top:20px}
.final-offer-note{
  display:block;
  margin-top:12px;
  color:#8194a5;
  font-size:.74rem
}

/* Price is intentionally revealed only at the bottom of each service page. */
.sales-hero>.sales-price,
.sales-contract-scope .sales-price,
.sales-fit .sales-price,
.sales-svg-section .sales-price{display:none!important}

@media(max-width:900px){
  .sales-fit-grid{grid-template-columns:1fr}
}
@media(max-width:760px){
  .sales-svg-shell{padding:12px 8px 12px;border-radius:18px}
  .sales-svg-chart{min-height:0}
  .svg-labels text{font-size:17px}
  .svg-legend{display:grid;gap:7px;padding:8px 8px 2px}
  .svg-legend small{text-align:left}
  .sales-final-offer{
    margin:8px 12px 58px;
    padding:30px 16px;
    border-radius:22px
  }
  .final-offer-copy h2{font-size:clamp(2rem,9vw,2.65rem)}
  .final-offer-value{gap:18px;margin-top:24px}
  .final-offer-price strong{font-size:clamp(3rem,15vw,4.2rem)}
  .final-offer-actions{display:grid!important;grid-template-columns:1fr!important}
  .final-offer-actions .button{width:100%}
}
@media(max-width:420px){
  .svg-labels text{font-size:15px}
}
@media(prefers-reduced-motion:reduce){
  .svg-line{stroke-dashoffset:0!important}
  .svg-area,.svg-points circle{opacity:1!important;transform:none!important;animation:none!important}
}
