/* 47 Web Design — V6.3 final production polish */
:root{
  --v63-ease:cubic-bezier(.2,.75,.25,1);
  --v63-fast:180ms;
  --v63-mid:520ms;
}

/* ---------- top market switch ---------- */
.markets55{gap:8px!important}
.market55{min-width:68px!important;height:34px!important;padding:4px 10px 4px 6px!important;gap:7px!important;justify-content:flex-start!important;border-radius:999px!important}
.market55 img{width:24px!important;height:24px!important;flex:0 0 24px!important}
.market55>span{display:flex!important;align-items:center!important;line-height:1!important}
.market55>span b{font-size:11px!important;letter-spacing:.05em!important}
.market55>span small{display:none!important}
.market55:hover{transform:translateY(-1px);border-color:color-mix(in srgb,var(--brand) 55%,var(--line))!important}

/* ---------- main menu ---------- */
.header59 .nav55{gap:8px!important}
.header59 .nav55>a,.header59 .nav-services55>button{
  min-height:42px!important;padding:0 16px!important;font-size:12px!important;font-weight:800!important;
  letter-spacing:.01em!important;border-radius:999px!important;transition:transform .18s ease,border-color .18s ease,background .18s ease,color .18s ease!important
}
.header59 .nav55>a:hover,.header59 .nav-services55>button:hover,.header59 .nav-services55.menu-open>button{transform:translateY(-1px)}
.header59 .nav-services55>button>span{width:22px;height:22px;display:inline-grid;place-items:center;border-radius:50%;margin-left:3px;background:color-mix(in srgb,var(--brand) 10%,transparent);border:1px solid color-mix(in srgb,var(--brand) 24%,transparent);transition:.2s}
.nav63-chevron{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transition:transform .22s var(--v63-ease)}
.nav-services55:hover .nav63-chevron,.nav-services55:focus-within .nav63-chevron,.nav-services55.menu-open .nav63-chevron{transform:rotate(180deg)}

/* ---------- homepage: approved layout, only requested details ---------- */
.v5-method-icon{display:grid!important;place-items:center!important}
.v5-method-icon svg{width:29px;height:29px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}
.reviews63-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:32px}
.reviews63-actions .btn{min-width:235px;justify-content:center}
.reviews63-facebook:before,.reviews63-google:before{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;margin-right:7px;font-weight:900}
.reviews63-facebook:before{content:"f";background:#1877f2;color:white}
.reviews63-google:before{content:"G";background:linear-gradient(135deg,#4285f4,#34a853 45%,#fbbc05 70%,#ea4335);color:white}

/* ---------- representative project images on service pages ---------- */
.service63-showcase{display:grid;grid-template-columns:1.15fr .85fr;gap:14px;min-width:0}
.service63-shot{margin:0;position:relative;border-radius:20px;overflow:hidden;border:1px solid color-mix(in srgb,var(--line) 90%,transparent);background:#07171d;box-shadow:0 22px 55px rgba(0,0,0,.18);min-width:0}
.service63-shot img{display:block;width:100%;aspect-ratio:16/10;object-fit:contain!important;object-position:center top!important;background:#07171d}
.service63-shot figcaption{position:absolute;left:10px;bottom:10px;padding:6px 10px;border-radius:999px;background:rgba(3,15,20,.82);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.12);color:#ecffff;font-size:10px;font-weight:800}
.service63-shot:nth-child(2){margin-top:38px}
.s55-visual-media{overflow:visible!important}

/* ---------- pricing ---------- */
.pricing63{position:relative;overflow:hidden}
.pricing63:before{content:"";position:absolute;right:-14vw;top:-16vw;width:38vw;height:38vw;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--brand) 12%,transparent),transparent 68%);pointer-events:none}
.pricing63-head{display:grid;grid-template-columns:1.15fr .85fr;gap:50px;align-items:end;margin-bottom:34px}
.pricing63-head h2{margin:.35rem 0 0;max-width:900px}
.pricing63-head p{margin:0;color:var(--muted);max-width:620px}
.pricing63-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;align-items:stretch}
.pricing63-card{position:relative;display:flex;flex-direction:column;min-height:100%;padding:26px 24px 24px;border:1px solid var(--line);border-radius:24px;background:color-mix(in srgb,var(--surface) 94%,transparent);overflow:hidden;transition:transform .24s var(--v63-ease),border-color .24s,box-shadow .24s}
.pricing63-card:hover{transform:translateY(-6px);border-color:color-mix(in srgb,var(--brand) 42%,var(--line));box-shadow:0 28px 70px rgba(0,0,0,.16)}
.pricing63-card.featured{border-color:color-mix(in srgb,var(--brand) 52%,var(--line));background:linear-gradient(155deg,color-mix(in srgb,var(--brand) 8%,var(--surface)),var(--surface))}
.pricing63-badge{position:absolute;right:16px;top:16px;padding:5px 8px;border-radius:999px;background:var(--brand);color:#031317;font-size:8px;font-weight:950;letter-spacing:.12em}
.pricing63-card h3{margin:0 0 20px;font-size:19px}
.pricing63-price{display:flex;align-items:end;gap:7px;margin-bottom:22px}
.pricing63-price strong{font-size:32px;line-height:1;color:var(--text);letter-spacing:-.04em}
.pricing63-price span{font-size:10px;color:var(--muted);padding-bottom:3px}
.pricing63-card ul{display:grid;gap:10px;margin:0 0 25px;padding:0;list-style:none;color:var(--muted);font-size:12px}
.pricing63-card li{position:relative;padding-left:20px}
.pricing63-card li:before{content:"✓";position:absolute;left:0;color:var(--brand);font-weight:900}
.pricing63-card .btn{margin-top:auto;justify-content:center}
.pricing63-note{text-align:center;color:var(--muted);font-size:11px;margin:20px auto 0;max-width:850px}

/* ---------- blog ---------- */
.page63-blog .blog63-hero{padding:78px 0 64px;position:relative;overflow:hidden}
.page63-blog .blog63-hero:after{content:"";position:absolute;right:-8vw;top:-20vw;width:50vw;height:50vw;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--brand) 14%,transparent),transparent 68%);pointer-events:none}
.page63-blog .blog63-hero .wrap{width:min(calc(100% - 64px),1680px)!important;max-width:1680px!important;margin:auto!important;text-align:left!important}
.page63-blog .blog63-hero h1{max-width:1120px!important;font-size:clamp(46px,5vw,78px)!important;line-height:1.02!important;margin:18px 0 22px!important}
.page63-blog .blog63-hero .lead{max-width:900px!important;font-size:18px!important}
.page63-blog .blog-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.article-card{display:flex!important;flex-direction:column!important;overflow:hidden!important;padding:0!important;border-radius:24px!important;min-height:100%!important}
.article63-thumb{aspect-ratio:16/10;overflow:hidden;background:#07171d;border-bottom:1px solid var(--line)}
.article63-thumb img{width:100%;height:100%;display:block;object-fit:cover;transition:transform .55s var(--v63-ease),filter .4s}
.article-card:hover .article63-thumb img{transform:scale(1.035);filter:saturate(1.06)}
.article-card>.cat,.article-card>h3,.article-card>p,.article-card>.read{margin-left:22px!important;margin-right:22px!important}
.article-card>.cat{margin-top:20px!important}
.article-card>.read{margin-top:auto!important;margin-bottom:22px!important}
.article-card>h3{font-size:21px!important;line-height:1.2!important}
.article-card>p{font-size:13px!important}
.article63-hero{padding-bottom:44px!important}
.article63-hero .wrap{width:min(calc(100% - 64px),1500px)!important;max-width:1500px!important;text-align:left!important}
.article63-hero h1{max-width:1100px!important;font-size:clamp(44px,5vw,72px)!important;line-height:1.04!important}
.article63-featured{padding:0 0 36px}
.article63-featured figure{margin:0;border-radius:28px;overflow:hidden;border:1px solid var(--line);background:#07171d;box-shadow:0 28px 80px rgba(0,0,0,.16)}
.article63-featured img{width:100%;display:block;aspect-ratio:16/7;object-fit:cover}

/* ---------- light/dark hardening ---------- */
html[data-theme="light"]{--bg:#f4f9fa;--surface:#ffffff;--surface2:#edf4f5;--text:#102329;--muted:#5c7178;--line:#d7e3e5}
html[data-theme="light"] body{background:var(--bg);color:var(--text)}
html[data-theme="light"] main :is(h1,h2,h3,h4,h5,h6){color:var(--text)}
html[data-theme="light"] main :is(p,li,small,.lead){color:var(--muted)}
html[data-theme="light"] .s55-hero,
html[data-theme="light"] .s55-proof,
html[data-theme="light"] .section-dark,
html[data-theme="light"] .v3-showcase,
html[data-theme="light"] .v3-showcase-card{
  --text:#f2fbfc;--muted:#a8bdc2;--line:rgba(167,219,223,.16);--surface:#0b2028;--surface2:#0e2730;
  color:#f2fbfc!important;background-color:#06171d!important
}
html[data-theme="light"] .s55-hero :is(h1,h2,h3,h4,h5,h6,p,li,.lead),
html[data-theme="light"] .s55-proof :is(h1,h2,h3,h4,h5,h6,p,li,.lead),
html[data-theme="light"] .section-dark :is(h1,h2,h3,h4,h5,h6,p,li,.lead),
html[data-theme="light"] .v3-showcase :is(h1,h2,h3,h4,h5,h6,p,li,.lead){color:inherit!important}
html[data-theme="light"] .s55-proof .wrap>div,html[data-theme="light"] .s55-proof-item,html[data-theme="light"] .v3-mini-grid>div{background:#0b2028!important;border-color:rgba(128,210,215,.18)!important;color:#f2fbfc!important}
html[data-theme="light"] .s55-proof b,html[data-theme="light"] .s55-proof strong,html[data-theme="light"] .v3-mini-grid strong{color:#f2fbfc!important}
html[data-theme="light"] .s55-proof span,html[data-theme="light"] .v3-mini-grid span{color:#a8bdc2!important}
html[data-theme="light"] .pricing63-card{background:#fff;color:#102329;box-shadow:0 14px 40px rgba(24,55,62,.06)}
html[data-theme="light"] .pricing63-card h3,html[data-theme="light"] .pricing63-price strong{color:#102329!important}
html[data-theme="light"] .pricing63-card li,html[data-theme="light"] .pricing63-card p{color:#5c7178!important}
html[data-theme="light"] .article-card{background:#fff!important}
html[data-theme="light"] .article-card h3{color:#102329!important}
html[data-theme="light"] .article-card p{color:#5c7178!important}
html[data-theme="light"] footer,html[data-theme="light"] .footer{--text:#effbfc;--muted:#9eb5bb;color:#effbfc;background:#041217!important}

/* ---------- global motion + hover ---------- */
.v63-ready main>section.v63-reveal{opacity:0;transform:translateY(30px);transition:opacity .72s var(--v63-ease),transform .72s var(--v63-ease)}
.v63-ready main>section.v63-reveal.v63-in{opacity:1;transform:none}
.v63-ready .v63-stagger>*{opacity:0;transform:translateY(18px);transition:opacity .55s var(--v63-ease),transform .55s var(--v63-ease)}
.v63-ready .v63-stagger.v63-in>*{opacity:1;transform:none}
.v63-ready .v63-stagger.v63-in>*:nth-child(2){transition-delay:.06s}.v63-ready .v63-stagger.v63-in>*:nth-child(3){transition-delay:.12s}.v63-ready .v63-stagger.v63-in>*:nth-child(4){transition-delay:.18s}.v63-ready .v63-stagger.v63-in>*:nth-child(5){transition-delay:.24s}.v63-ready .v63-stagger.v63-in>*:nth-child(6){transition-delay:.30s}
.btn{position:relative;overflow:hidden;transition:transform .2s var(--v63-ease),box-shadow .2s,border-color .2s,background .2s!important}
.btn:after{content:"";position:absolute;top:-150%;left:-40%;width:32%;height:400%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.24),transparent);transform:rotate(18deg);transition:left .55s var(--v63-ease);pointer-events:none}
.btn:hover{transform:translateY(-2px)!important;box-shadow:0 12px 30px rgba(0,0,0,.12)}
.btn:hover:after{left:120%}
:is(.v3-service-card,.v3-project-card,.v5-work,.v5-project,.v3-review,.deliver,.s55-card,.pricing63-card,.article-card){will-change:transform}

@media(max-width:1100px){
  .page63-blog .blog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pricing63-head{grid-template-columns:1fr;gap:14px}
  .service63-showcase{grid-template-columns:1fr 1fr}
  .service63-shot:nth-child(2){margin-top:18px}
}
@media(max-width:700px){
  .market55{min-width:52px!important;padding-right:7px!important}.market55>span b{font-size:10px!important}
  .page63-blog .blog63-hero .wrap,.article63-hero .wrap{width:calc(100% - 28px)!important}
  .page63-blog .blog-grid{grid-template-columns:1fr}.page63-blog .blog63-hero h1,.article63-hero h1{font-size:40px!important}
  .service63-showcase{grid-template-columns:1fr}.service63-shot:nth-child(2){margin-top:0}
  .pricing63-grid{grid-template-columns:1fr}.pricing63-card{padding:23px 20px}
  .article63-featured img{aspect-ratio:4/3}
  .reviews63-actions{display:grid}.reviews63-actions .btn{min-width:0;width:100%}
}
@media(prefers-reduced-motion:reduce){
  *,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .v63-ready main>section.v63-reveal,.v63-ready .v63-stagger>*{opacity:1!important;transform:none!important}
}

/* ===== V6.4 corrections for original points 1–7 ===== */

/* Point 1 — homepage-only motion. No V6.3 reveal classes are injected on inner pages. */
html.v63-ready body.page-home-v64 .v3-slide.active .v3-hero-copy>*{
  animation:v64HomeCopy .72s var(--v63-ease) both;
}
html.v63-ready body.page-home-v64 .v3-slide.active .v3-hero-copy>*:nth-child(1){animation-delay:.03s}
html.v63-ready body.page-home-v64 .v3-slide.active .v3-hero-copy>*:nth-child(2){animation-delay:.10s}
html.v63-ready body.page-home-v64 .v3-slide.active .v3-hero-copy>*:nth-child(3){animation-delay:.17s}
html.v63-ready body.page-home-v64 .v3-slide.active .v3-hero-copy>*:nth-child(4){animation-delay:.24s}
html.v63-ready body.page-home-v64 .v3-slide.active .v3-hero-copy>*:nth-child(5){animation-delay:.31s}
html.v63-ready body.page-home-v64 .v3-slide.active .v3-hero-bg img{animation:v64HomeHero 1.15s var(--v63-ease) both}
@keyframes v64HomeCopy{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
@keyframes v64HomeHero{from{opacity:.55;transform:scale(1.075)}to{opacity:1;transform:scale(1.045)}}

/* Point 2 — service hero artwork is always shown in full. */
.page63-service .s55-hero-media{overflow:hidden!important;display:grid!important;place-items:center!important}
.page63-service .s55-hero-media>img{
  width:100%!important;height:100%!important;max-width:100%!important;max-height:100%!important;
  object-fit:contain!important;object-position:center center!important;
}

/* Point 3 — local service-specific illustrations; no client screenshots. */
.service64-svg{width:100%;height:100%;max-width:760px;max-height:500px;display:block;color:var(--s55);overflow:visible}
.service64-svg :is(rect,circle,path){vector-effect:non-scaling-stroke;stroke:currentColor;stroke-width:4;fill:none;stroke-linecap:round;stroke-linejoin:round}
.service64-svg .s64-frame{fill:color-mix(in srgb,var(--surface) 85%,var(--s55) 5%);stroke:color-mix(in srgb,var(--s55) 38%,var(--line))}
.service64-svg .s64-node{fill:color-mix(in srgb,var(--s55) 14%,transparent);stroke:var(--s55)}
.s55-visual-media:has(.service64-svg){height:auto!important;min-height:430px!important;padding:24px!important;overflow:hidden!important}
html[data-theme="light"] .service64-svg .s64-frame{fill:#fff}

/* Point 5 — make the package carried into the quote visibly explicit. */
.quote64-selection{margin:0 0 26px;padding:20px 22px;border:1px solid color-mix(in srgb,var(--brand) 45%,var(--line));border-radius:18px;background:linear-gradient(135deg,color-mix(in srgb,var(--brand) 10%,var(--surface)),var(--surface))}
.quote64-selection span{display:block;font-size:9px;font-weight:950;letter-spacing:.15em;color:var(--brand);margin-bottom:7px}
.quote64-selection strong{display:block;font-size:24px;line-height:1.1;color:var(--text)}
.quote64-selection p{margin:7px 0 0!important;color:var(--muted)!important;font-size:13px!important}

/* Point 6 — Website Development architecture uses the full content width. */
.page63-service .s55-architecture .s55-head{max-width:none!important}
.page63-service .s55-architecture .s55-arch{
  max-width:none!important;width:100%!important;margin:0!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:14px!important;
}
.page63-service .s55-architecture .s55-arch article{
  display:flex!important;flex-direction:column!important;align-items:flex-start!important;justify-content:flex-start!important;
  min-width:0!important;min-height:230px!important;padding:26px!important;border-radius:20px!important;
}
.page63-service .s55-architecture .s55-arch article:before{display:none!important}
.page63-service .s55-architecture .s55-arch article>b{display:inline-flex;align-items:center;justify-content:center;min-width:52px;height:34px;padding:0 10px;border-radius:999px;background:var(--s55-soft);border:1px solid var(--s55-line);margin-bottom:34px}
.page63-service .s55-architecture .s55-arch h3{margin:0 0 9px!important}
.page63-service .s55-architecture .s55-arch p{margin:0!important}

@media(max-width:1100px){
  .page63-service .s55-architecture .s55-arch{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .page63-service .s55-architecture .s55-arch article:last-child{grid-column:1/-1}
}
@media(max-width:700px){
  .page63-service .s55-architecture .s55-arch{grid-template-columns:1fr!important}
  .page63-service .s55-architecture .s55-arch article:last-child{grid-column:auto}
  .page63-service .s55-architecture .s55-arch article{min-height:0!important}
  .s55-visual-media:has(.service64-svg){min-height:300px!important;padding:12px!important}
}
@media(prefers-reduced-motion:reduce){
  html.v63-ready body.page-home-v64 .v3-slide.active .v3-hero-copy>*,
  html.v63-ready body.page-home-v64 .v3-slide.active .v3-hero-bg img{animation:none!important}
}