/* Shared conversion components; readable with either theme and without scripts. */
html[data-theme="light"] { --muted:#526984; }
body[data-page]:not([data-page="home"]) { background:#091322; }
html[data-theme="light"] body[data-page]:not([data-page="home"]) { background:#f9fbff; }
body[data-page]:not([data-page="home"])::before, body[data-page]:not([data-page="home"])::after { display:none; }
body[data-page]:not([data-page="home"]) .container { width:min(1180px,calc(100% - 64px)); margin-inline:auto; padding-inline:0; }
body[data-page]:not([data-page="home"]) .hero-copy h1 { max-width:24ch; font-size:clamp(34px,3.8vw,52px); line-height:1.12; letter-spacing:-1.2px; overflow-wrap:normal; }
body[data-page]:not([data-page="home"]) .hero-lead { font-size:17px; line-height:1.7; max-width:58ch; }
body[data-page]:not([data-page="home"]) .hero-actions .button { min-height:50px; font-size:15px; border-radius:10px; padding:12px 20px; }
body[data-page]:not([data-page="home"]) .section-copy, body[data-page]:not([data-page="home"]) .feature-card p, body[data-page]:not([data-page="home"]) .service-card p { font-size:16px; line-height:1.7; }
.project-brief .button { border-radius:9px; box-shadow:none; }
.hero-proof { display:flex; flex-wrap:wrap; gap:9px 20px; margin:22px 0 0; padding:0; list-style:none; color:var(--muted); font-size:13px; }
.hero-proof li::before { content:'✓'; margin-right:7px; color:var(--dn-green); }
.hero-quick-contact { display:inline-flex; align-items:center; gap:9px; margin-top:20px; color:var(--dn-green); font-size:14px; text-decoration:underline; text-underline-offset:4px; min-height:32px; }
.studio-hero h1 { font-size:clamp(36px,4.25vw,58px); }
.intent-link { color:var(--dn-blue); text-underline-offset:4px; }
.service-toc { display:flex; flex-wrap:wrap; gap:8px; padding-block:12px 20px; }
.service-toc a { padding:11px 16px; border:1px solid var(--line); border-radius:8px; color:var(--muted); font-size:14px; background:var(--dn-subtle); }
.service-toc a:hover { color:var(--text); border-color:var(--dn-blue); }
.budget-section { background:var(--dn-subtle); border-block:1px solid var(--line); }
.budget-grid { display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:start; }
.budget-grid h2, .brief-intro h2, .launch-section h2 { font-size:clamp(28px,3.2vw,40px); line-height:1.18; letter-spacing:-1px; margin:0 0 20px; }
.budget-grid p, .brief-intro > p, .launch-intro { color:var(--muted); line-height:1.7; }
.budget-grid .button { margin-top:16px; }
.estimate-factors { display:grid; gap:0; margin:0; }
.estimate-factors > div { padding:18px 0; border-bottom:1px solid var(--line); }
.estimate-factors > div:first-child { padding-top:0; }
.estimate-factors dt { color:var(--text); font-weight:600; margin-bottom:5px; }
.estimate-factors dd { margin:0; color:var(--muted); line-height:1.6; font-size:15px; }
.launch-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; margin-top:28px; }
.launch-card { padding:27px; border:1px solid var(--line); border-radius:14px; background:var(--dn-panel); }
.launch-card .launch-number { color:var(--dn-green); font:500 12px 'Space Grotesk',sans-serif; letter-spacing:1px; }
.launch-card h3 { margin:14px 0 10px; font-size:20px; line-height:1.25; }
.launch-card p { color:var(--muted); line-height:1.65; font-size:15px; margin:0; }
.brief-section { border-top:1px solid var(--line); }
.brief-grid { display:grid; grid-template-columns:.88fr 1.12fr; gap:70px; align-items:start; }
.brief-intro .studio-eyebrow { margin-bottom:20px; }
.brief-steps { padding:0; margin:25px 0; list-style:none; counter-reset:brief-step; }
.brief-steps li { counter-increment:brief-step; display:flex; align-items:center; gap:12px; padding:10px 0; color:var(--muted); font-size:15px; }
.brief-steps li::before { content:counter(brief-step); display:grid; place-items:center; flex-shrink:0; width:27px; height:27px; border:1px solid var(--line); border-radius:50%; font-size:12px; color:var(--dn-blue); }
.brief-direct { display:flex; flex-wrap:wrap; gap:12px 22px; margin-top:28px; }
.brief-direct a { color:var(--dn-blue); text-decoration:underline; text-underline-offset:4px; min-height:32px; }
.project-brief { min-width:0; margin:0; padding:30px; background:var(--dn-panel); border:1px solid var(--line); border-radius:18px; }
.form-row { display:grid; gap:8px; margin:0 0 20px; }
.form-row label { font-size:14px; font-weight:500; }
.form-row label > small { color:var(--muted); font-weight:400; }
.project-brief select, .project-brief textarea { display:block; width:100%; min-width:0; box-sizing:border-box; border:1px solid var(--line); border-radius:9px; background:var(--dn-subtle); color:var(--text); padding:13px; font:400 16px/1.5 'IBM Plex Sans',sans-serif; }
.project-brief select { min-height:50px; padding-right:30px; }
.project-brief textarea { resize:vertical; min-height:104px; }
.project-brief textarea::placeholder { color:var(--muted); opacity:.8; }
.brief-hint { margin:0 0 22px; padding:16px; border-left:2px solid var(--dn-green); background:var(--dn-subtle); }
.brief-hint p { margin:0 0 9px; color:var(--muted); font-size:14px; line-height:1.6; }
.brief-hint a { font-size:13px; color:var(--dn-blue); text-decoration:underline; text-underline-offset:3px; }
.brief-submit { width:100%; min-height:52px; cursor:pointer; }
.brief-submit:disabled { opacity:.6; cursor:default; }
.brief-privacy { font-size:12px; line-height:1.6; color:var(--muted); margin:12px 0 0; }
.brief-result { margin-top:24px; padding-top:24px; border-top:1px solid var(--line); scroll-margin-block:110px; }
.brief-result h3 { margin:0 0 12px; font-size:20px; }
.brief-result textarea { font-size:14px; line-height:1.6; min-height:200px; margin-top:8px; }
.brief-result label { font-size:13px; color:var(--muted); }
.brief-result-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:15px; }
.brief-result-actions .button { width:100%; padding-inline:14px; text-align:center; font-size:14px; }
.plain-button { background:transparent; border:0; cursor:pointer; color:var(--dn-blue); padding:10px 0; font:inherit; font-size:13px; text-decoration:underline; text-underline-offset:4px; }
.brief-result-actions .plain-button { margin-right:12px; }
.brief-status { color:var(--dn-green); font-size:13px; line-height:1.6; }
.contact-context { display:inline-block; padding:6px 10px; margin:0 0 16px; color:var(--dn-blue); background:var(--dn-subtle); border-radius:7px; font-size:13px; }
.contact-option-primary { border-color:var(--dn-green); }
.contact-dialog .contact-options { grid-template-columns:1fr 1fr; }
.contact-alternatives { display:flex; flex-wrap:wrap; gap:12px 24px; padding-top:22px; color:var(--dn-blue); font-size:14px; }
.contact-alternatives a { min-height:30px; text-decoration:underline; text-underline-offset:4px; }
.contact-backups { margin-top:12px; font-size:13px; color:var(--muted); }
.contact-backups summary { cursor:pointer; min-height:36px; padding-block:8px; }
.contact-backups p { display:flex; flex-wrap:wrap; gap:16px; }
.contact-backups a { color:var(--dn-blue); }
.mobile-contact-bar { display:none; }
.wallet-scan-visual { min-height:0; gap:16px; place-items:center; align-content:center; }
.wallet-scan-signal, .wallet-scan-photo-card { position:relative; inset:auto; width:100%; max-width:340px; }
.wallet-scan-phone { width:min(260px,100%); margin:0; }
.wallet-scan-screen { aspect-ratio:362 / 795; }
.wallet-scan-photo-card { display:grid; grid-template-columns:72px minmax(0,1fr); gap:14px; align-items:center; }
.wallet-scan-photo-card img { width:72px; height:auto; aspect-ratio:1; margin:0; object-fit:contain; }
.site-footer .footer-grid { grid-template-columns:210px minmax(0,1fr) minmax(230px,280px); align-items:start; }
.site-footer .footer-links { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px 20px; }
.site-footer .footer-links a { overflow-wrap:anywhere; }
@media (max-width:1100px) {
  .site-footer .footer-grid { grid-template-columns:minmax(0,1fr); }
  .site-footer .footer-contact { text-align:left; }
}
@media (max-width:560px) {
  .site-footer .footer-links { grid-template-columns:minmax(0,1fr); }
}
html:not(.js-ready) .project-brief > :not(noscript) { display:none; }
.product-card { position:relative; }
.product-card:focus-within { border-color:var(--dn-blue); }
.product-link::after { content:''; position:absolute; inset:0; border-radius:14px; }
.service-summary-list { margin:22px 0 0; padding-left:20px; color:var(--muted); line-height:1.85; }
.homepage-directory { background:var(--dn-subtle); border-block:1px solid var(--line); }
.directory-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.directory-card { position:relative; display:flex; flex-direction:column; gap:10px; min-height:170px; padding:22px; border:1px solid var(--line); border-radius:14px; background:var(--dn-panel); color:var(--text); transition:transform .2s,border-color .2s,background .2s; }
.directory-card:hover,.directory-card:focus-visible { transform:translateY(-3px); border-color:var(--dn-blue); background:var(--dn-subtle); }
.directory-card-featured { border-color:#79adff55; background:linear-gradient(135deg,#79adff16,transparent 70%),var(--dn-panel); }
.directory-number { color:var(--dn-blue); font:500 12px 'Space Grotesk',sans-serif; letter-spacing:1px; }
.directory-card strong { max-width:22ch; padding-right:22px; font-size:18px; line-height:1.25; }
.directory-card > span:not(.directory-number) { max-width:32ch; color:var(--muted); font-size:14px; line-height:1.55; }
.directory-card b { position:absolute; right:20px; top:20px; color:var(--dn-blue); font-size:18px; font-weight:400; }
.directory-bottom { display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px 20px; margin-top:20px; padding-top:18px; border-top:1px solid var(--line); color:var(--muted); font-size:14px; }
.directory-bottom a { color:var(--dn-blue); text-decoration:underline; text-underline-offset:4px; }
.service-hero-note { margin:16px 0 0; font-size:13px; color:var(--muted); }
.service-landing .hero h1 { font-size:clamp(34px,4vw,54px); }
.service-landing .hero-grid { align-items:start; }
.service-landing .section-title { max-width:850px; }
@media (max-width:900px) {
  .brief-grid { gap:30px; grid-template-columns:1fr 1.15fr; }
  .budget-grid { gap:30px; }
  .launch-grid { gap:12px; }
  .launch-card { padding:20px; }
}
@media (max-width:700px) {
  body[data-page]:not([data-page="home"]) .container { width:calc(100% - 36px); }
  body[data-page]:not([data-page="home"]) .hero-copy h1 { font-size:32px; line-height:1.16; letter-spacing:-.8px; max-width:none; }
  body[data-page]:not([data-page="home"]) .hero-lead { font-size:16px; line-height:1.65; }
  body[data-page]:not([data-page="home"]) .hero-showcase { width:100%; max-width:none; margin:12px 0 0; }
  body { padding-bottom:calc(76px + env(safe-area-inset-bottom,0px)); }
  .brief-grid, .budget-grid { grid-template-columns:1fr; gap:28px; }
  .directory-grid { grid-template-columns:1fr; gap:10px; }
  .directory-card { min-height:0; padding:19px; }
  .directory-card strong { font-size:17px; }
  .launch-grid { grid-template-columns:1fr; }
  .project-brief { padding:22px; }
  .brief-intro h2 { max-width:400px; }
  .brief-steps { margin:15px 0; }
  .brief-direct { margin-top:16px; }
  .mobile-contact-bar { display:grid; grid-template-columns:1fr 1fr; gap:10px; position:fixed; z-index:40; bottom:0; left:0; right:0; padding:10px 16px calc(10px + env(safe-area-inset-bottom,0px)); border-top:1px solid var(--line); background:var(--dn-panel); box-shadow:0 -8px 24px #0001; }
  .mobile-contact-bar a { display:flex; align-items:center; justify-content:center; min-height:46px; padding:8px 6px; border:1px solid var(--line); border-radius:9px; font-size:13px; line-height:1.25; text-align:center; color:var(--text); }
  .mobile-contact-bar .mobile-whatsapp { background:#a0e7ca; color:#102b24; border-color:transparent; font-weight:600; }
  .contact-open .mobile-contact-bar, .nav-open .mobile-contact-bar { visibility:hidden; }
  .brief-in-view .mobile-contact-bar { display:none; }
  .service-toc { gap:6px; padding-bottom:10px; }
  .service-toc a { font-size:12px; padding:10px 12px; }
  .hero-proof { font-size:12px; }
  .contact-dialog .contact-options { grid-template-columns:1fr; }
}
@media (max-width:360px) { .project-brief { padding:17px; } .studio-hero h1 { font-size:34px; letter-spacing:-1.2px; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }
.product-card .product-description { margin-bottom:18px; }
.product-example { margin:auto 0 20px; overflow:hidden; border:1px solid var(--line); border-radius:10px; background:var(--dn-panel); }
.product-example img { display:block; width:100%; height:auto; aspect-ratio:4/3; object-fit:contain; background:#0b1727; }
.product-example video { display:block; width:100%; height:auto; aspect-ratio:4/3; object-fit:contain; background:#0b1727; }
.delivery-slides { position:relative; aspect-ratio:4/3; overflow:hidden; }
.delivery-slides img { position:absolute; inset:0; height:100%; object-fit:contain; background:#0b1727; opacity:0; transition:opacity .7s ease; }
.delivery-slides img.is-active { opacity:1; }
.delivery-carousel figcaption { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:4px 8px; }
.delivery-controls { display:flex; align-items:center; }
.delivery-controls[hidden] { display:none; }
.delivery-controls button { position:relative; z-index:2; display:grid; place-items:center; width:25px; height:25px; padding:0; border:0; border-radius:6px; background:transparent; cursor:pointer; }
.delivery-controls button span { width:6px; height:6px; border-radius:50%; background:var(--muted); opacity:.45; }
.delivery-controls button[aria-pressed="true"] span { opacity:1; background:#80b4ff; }
.delivery-controls button:hover { background:#80b4ff20; }
.wallet-slides { position:relative; aspect-ratio:4/3; overflow:hidden; }
.wallet-slides img { position:absolute; inset:0; height:100%; object-fit:contain; background:#0b1727; opacity:0; transition:opacity .7s ease; }
.wallet-slides img.is-active { opacity:1; }
.wallet-carousel figcaption { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:4px 8px; }
.wallet-controls { display:flex; align-items:center; }
.wallet-controls[hidden] { display:none; }
.wallet-controls button { position:relative; z-index:2; display:grid; place-items:center; width:25px; height:25px; padding:0; border:0; border-radius:6px; background:transparent; cursor:pointer; }
.wallet-controls button span { width:6px; height:6px; border-radius:50%; background:var(--muted); opacity:.45; }
.wallet-controls button[aria-pressed="true"] span { opacity:1; background:#80b4ff; }
.wallet-controls button:hover { background:#80b4ff20; }
.product-example figcaption { padding:10px 12px; color:var(--muted); font-size:12px; line-height:1.4; }
.product-card .product-card-bottom { margin-top:0; }
.kiosk-slides { position:relative; aspect-ratio:4/3; overflow:hidden; }
.kiosk-slides img { position:absolute; inset:0; height:100%; object-fit:cover; opacity:0; transition:opacity .7s ease; }
.kiosk-slides img.is-active { opacity:1; }
.kiosk-carousel figcaption { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:4px 8px; }
.kiosk-controls { display:flex; align-items:center; }
.kiosk-controls[hidden] { display:none; }
.kiosk-controls button { position:relative; z-index:2; display:grid; place-items:center; width:30px; height:30px; padding:0; border:0; border-radius:6px; background:transparent; color:var(--text); cursor:pointer; }
.kiosk-controls button[data-kiosk-slide] span { width:6px; height:6px; border-radius:50%; background:var(--muted); opacity:.45; }
.kiosk-controls button[aria-pressed="true"] span { opacity:1; background:#80b4ff; }
.kiosk-controls button[data-kiosk-pause] span { background:none; }
.kiosk-controls button:hover { background:#80b4ff20; }
.kiosk-controls button:focus-visible { outline:2px solid #80b4ff; outline-offset:1px; }
@media (prefers-reduced-motion:reduce) { .kiosk-slides img { transition:none; } }
.bots-slides { position:relative; aspect-ratio:4/3; overflow:hidden; }
.bots-slides img { position:absolute; inset:0; height:100%; object-fit:contain; background:#0b1727; opacity:0; transition:opacity .7s ease; }
.bots-slides img.is-active { opacity:1; }
.bots-carousel figcaption { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:4px 8px; }
.bots-controls { display:flex; align-items:center; }
.bots-controls[hidden] { display:none; }
.bots-controls button { position:relative; z-index:2; display:grid; place-items:center; width:25px; height:25px; padding:0; border:0; border-radius:6px; background:transparent; cursor:pointer; }
.bots-controls button span { width:6px; height:6px; border-radius:50%; background:var(--muted); opacity:.45; }
.bots-controls button[aria-pressed="true"] span { opacity:1; background:#80b4ff; }
.bots-controls button:hover { background:#80b4ff20; }
.bots-controls button:focus-visible { outline:2px solid #80b4ff; outline-offset:1px; }
@media (prefers-reduced-motion:reduce) { .bots-slides img { transition:none; } }
.plugins-slides { position:relative; aspect-ratio:4/3; overflow:hidden; }
.plugins-slides img { position:absolute; inset:0; height:100%; object-fit:contain; background:#0b1727; opacity:0; transition:opacity .7s ease; }
.plugins-slides img.is-active { opacity:1; }
.plugins-carousel figcaption { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:4px 8px; }
.plugins-controls { display:flex; align-items:center; }
.plugins-controls[hidden] { display:none; }
.plugins-controls button { position:relative; z-index:2; display:grid; place-items:center; width:25px; height:25px; padding:0; border:0; border-radius:6px; background:transparent; cursor:pointer; }
.plugins-controls button span { width:6px; height:6px; border-radius:50%; background:var(--muted); opacity:.45; }
.plugins-controls button[aria-pressed="true"] span { opacity:1; background:#80b4ff; }
.plugins-controls button:hover { background:#80b4ff20; }
.plugins-controls button:focus-visible { outline:2px solid #80b4ff; outline-offset:1px; }
@media (prefers-reduced-motion:reduce) { .plugins-slides img { transition:none; } }
@media print { .mobile-contact-bar, .project-brief, .site-header, .contact-modal { display:none !important; } body { padding:0; } }