/* Durazno Web Studio — clean, airy visual system */
:root{
  --ink:#1d2b39;
  --muted:#647589;
  --brand-blue:#0798f7;
  --brand-blue-strong:#0877df;
  --brand-blue-soft:#e8f6ff;
  --brand-orange:#f28b45;
  --brand-orange-soft:#fff1e5;
  --brand-yellow:#ffd45a;
  --brand-leaf:#83ad28;
  --paper:#fbfdff;
  --surface:#ffffff;
  --line:#e3edf4;
  --shadow:0 18px 54px rgba(38,91,130,.09);
  --shadow-hover:0 24px 62px rgba(38,91,130,.15);
}
*{scroll-margin-top:96px}
html{scroll-behavior:smooth;scroll-padding-top:88px}
body{
  background:var(--paper);
  color:var(--ink);
  font-family:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  font-synthesis:none;
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{font-family:"Inter",system-ui,sans-serif;letter-spacing:-.045em}
p{color:var(--muted);line-height:1.7}
a,button{-webkit-tap-highlight-color:transparent}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #0798f7;outline-offset:3px}
::selection{background:#d8f0ff;color:#174267}

/* Header — white, quiet, with the real horizontal mark */
.nav-shell{
  background:rgba(255,255,255,.91);
  border-bottom:1px solid rgba(217,232,242,.88);
  box-shadow:0 5px 24px rgba(28,83,117,.045);
  backdrop-filter:blur(18px);
}
nav{height:82px}
.brand{gap:0;min-width:0;display:flex;align-items:center}
.brand img.brand-logo{
  display:block;width:178px;height:auto;max-height:65px;object-fit:contain;
  border:0;border-radius:0;padding:0;background:transparent;box-shadow:none;
}
.links{gap:clamp(12px,1.65vw,22px)}
.links>a:not(.btn){color:#52667a;font-size:.9rem;font-weight:600;transition:color .18s ease}
.links>a:not(.btn):hover{color:var(--brand-blue-strong)}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  border-radius:12px;font-weight:700;letter-spacing:-.01em;
  transition:transform .2s ease,box-shadow .2s ease,background-color .2s ease,border-color .2s ease;
}
.btn:hover{transform:translateY(-2px)}
.btn.primary,.primary{
  background:var(--brand-blue);color:#fff;border:1px solid var(--brand-blue);
  box-shadow:0 8px 22px rgba(7,152,247,.19);
}
.btn.primary:hover,.primary:hover{background:var(--brand-blue-strong);box-shadow:0 12px 28px rgba(7,119,223,.24)}
.btn.secondary,.secondary{
  background:rgba(255,255,255,.84);color:#23516e;border:1px solid #cfe5f5;
  box-shadow:0 4px 14px rgba(39,104,145,.04);
}
.btn.secondary:hover,.secondary:hover{background:#f0f9ff;border-color:#a9dafa}

/* Hero — big type, large breathing room, color used as an accent */
.hero{
  position:relative;isolation:isolate;overflow:hidden;
  padding:84px 0 74px;
  background:
    radial-gradient(circle at 76% 20%,rgba(7,152,247,.075),transparent 23%),
    radial-gradient(circle at 87% 83%,rgba(242,139,69,.09),transparent 25%),
    linear-gradient(180deg,#f8fcff 0%,#fffdf9 100%);
}
.hero:after{
  content:"";position:absolute;z-index:-1;width:460px;height:460px;right:-205px;top:-200px;
  border-radius:50%;border:1px solid rgba(7,152,247,.11);
  background:radial-gradient(circle,rgba(7,152,247,.045),rgba(7,152,247,0) 68%);
}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.03fr) minmax(340px,.97fr);align-items:center;gap:clamp(32px,5.4vw,72px)}
.hero .eyebrow,.section .eyebrow{
  font:500 .74rem/1.5 "DM Mono",ui-monospace,monospace;
  color:var(--brand-blue-strong);letter-spacing:.12em;text-transform:uppercase;
  margin-bottom:18px;
}
.hero .eyebrow{display:inline-flex;align-items:center;gap:9px;border:1px solid #d9eefb;background:#f1faff;padding:7px 12px;border-radius:99px}
.hero .eyebrow:before{content:"";width:7px;height:7px;border-radius:50%;background:var(--brand-orange);box-shadow:0 0 0 4px #fff0e4}
.hero h1{font-size:clamp(3.2rem,6.1vw,5.65rem);line-height:.98;letter-spacing:-.075em;max-width:720px;color:#192c3c;margin:0 0 23px}
.hero h1 em{font-style:normal;color:var(--brand-blue-strong);background:none;-webkit-text-fill-color:initial}
.hero-copy>p,.hero-grid>div:first-child>p{font-size:1.08rem;line-height:1.75;max-width:560px;color:#607287;margin:0 0 27px}
.hero .actions{display:flex;gap:12px;flex-wrap:wrap}
.hero .actions .btn{min-height:48px;padding:0 20px}
.hero .checks{display:flex;flex-wrap:wrap;gap:10px 18px;margin-top:25px;color:#637487;font-size:.84rem}
.hero .checks span{display:inline-flex;align-items:center;gap:7px}
.hero .checks b{color:#71a81e;font-size:1rem}
.illustration{position:relative;isolation:isolate;min-width:0;animation:heroFloat 7s ease-in-out infinite}
.landscape{
  position:relative;overflow:hidden;aspect-ratio:1.02;border-radius:46% 54% 50% 50%;
  background:linear-gradient(145deg,#dff5ff 0%,#fff0e0 58%,#fce5df 100%);
  border:1px solid rgba(255,255,255,.95);box-shadow:0 28px 72px rgba(73,139,179,.13);
}
.landscape:before{
  content:"";position:absolute;width:74%;aspect-ratio:1;right:-7%;top:-15%;border-radius:50%;
  border:1px solid rgba(7,152,247,.13);background:rgba(255,255,255,.32);
}
.sun{
  position:absolute;width:34%;aspect-ratio:1;top:17%;right:17%;border-radius:50%;
  background:linear-gradient(135deg,#ffe9a1,#ffbe74);box-shadow:0 0 0 16px rgba(255,212,90,.15);
}
.hill{
  position:absolute;width:120%;height:64%;bottom:-22%;left:-16%;border-radius:52% 48% 0 0;
  background:linear-gradient(145deg,#c9e7a0,#96d3ba 62%,#a5e5eb);
  transform:rotate(-9deg);
}
.hill:after{
  content:"";position:absolute;left:43%;top:-13%;width:90%;height:100%;border-radius:50% 50% 0 0;
  background:linear-gradient(130deg,#a8def4,#dbf5f4);transform:rotate(15deg);
}
.sticker{
  position:absolute;padding:12px 15px;border-radius:14px;background:rgba(255,255,255,.91);
  border:1px solid rgba(219,235,245,.95);box-shadow:0 13px 30px rgba(37,87,119,.11);
  font-size:.82rem;font-weight:700;color:#39566b;backdrop-filter:blur(10px);
}
.s1{left:-4%;top:17%;color:#a35e2d}
.s2{right:-3%;bottom:19%;color:#1677a7}
.note{
  position:absolute;left:10%;bottom:4%;display:grid;gap:4px;max-width:245px;
  padding:15px 18px;border-radius:16px;border:1px solid #e0eaf1;
  background:rgba(255,255,255,.96);box-shadow:var(--shadow);
}
.note strong{font-size:1rem;letter-spacing:-.03em;color:#1d2f3e}.note span{font-size:.8rem;color:#6a7b8d;line-height:1.5}

/* A small trust strip, not another block of loud color */
.proof{background:#fff;border-block:1px solid #edf3f7;padding:20px 0}
.proof-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;color:#52687b;font-size:.9rem}
.proof-grid>div{display:flex;align-items:center;justify-content:center;gap:9px}
.proof b{display:grid;place-items:center;width:30px;height:30px;border-radius:10px;background:#edf8ff;color:#188bc9;font-size:1rem}

/* Pricing — generous whitespace and one clear recommended package */
.section{padding:88px 0}
.pricing{background:linear-gradient(180deg,#f5faff 0%,#fbfdff 100%)}
.head{max-width:780px;margin:0 auto 38px;text-align:center}
.head h2{font-size:clamp(2rem,4.1vw,3.15rem);line-height:1.09;letter-spacing:-.06em;color:#1d2d3b;margin:0 0 17px}
.head>p{font-size:1rem;line-height:1.75;color:#65768a;margin:0 auto;max-width:700px}
.cards{align-items:stretch;gap:20px}
.card{
  position:relative;border:1px solid #e1ebf2;border-radius:22px;background:#fff;
  padding:28px 25px 25px;box-shadow:0 10px 34px rgba(33,81,114,.055);
  transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease;
}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow-hover);border-color:#cfe7f6}
.card.featured{border:1px solid #9ad8f7;box-shadow:0 18px 48px rgba(7,152,247,.105);transform:translateY(-4px)}
.card.featured:before{content:"";position:absolute;left:24px;right:24px;top:0;height:3px;border-radius:0 0 8px 8px;background:linear-gradient(90deg,#0798f7,#72c7f5)}
.card .plan{font:500 .75rem "DM Mono",monospace;color:#4684a9;text-transform:uppercase;letter-spacing:.08em;margin-bottom:12px}
.card .price{font-size:clamp(2.2rem,3.6vw,2.8rem);line-height:1.05;letter-spacing:-.07em;color:#1f3545;margin:0 0 14px}
.card .price small{font-size:.8rem;letter-spacing:0;color:#6e8192;font-weight:600}
.card h3{font-size:1.24rem;line-height:1.25;color:#253b4b;margin:0 0 10px}
.card>p{font-size:.9rem;line-height:1.65;min-height:72px;margin:0 0 17px;color:#65768a}
.card .tag{position:absolute;top:15px;right:16px;padding:6px 10px;border-radius:99px;background:#e9f7ff;color:#0877b5;font-size:.69rem;font-weight:800}
.card .inclusion{display:inline-flex;align-items:center;padding:8px 10px;border-radius:10px;background:#f1f8e8;color:#557f1f;border:1px solid #e2efd1;font-size:.77rem;font-weight:700;margin-bottom:18px}
.card ul{display:grid;gap:11px;margin:0 0 24px;padding:0;list-style:none}
.card li{position:relative;padding-left:22px;font-size:.84rem;line-height:1.5;color:#586b7e}
.card li:before{content:"✓";position:absolute;left:0;top:0;color:#79a925;font-weight:800}
.card .btn{width:100%;min-height:46px}
.fine{color:#8794a3;font-size:.77rem;line-height:1.7;margin-top:24px}

/* Service cards: light surfaces and tiny brand-colour signals */
.services{gap:18px}
.service{
  background:#fff;border:1px solid #e4edf4;border-radius:20px;
  box-shadow:0 10px 28px rgba(38,91,130,.045);
  transition:transform .23s ease,box-shadow .23s ease,border-color .23s ease;
}
.service:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:#cce6f5}
.service:nth-child(1),.service:nth-child(2),.service:nth-child(3),.service:nth-child(4){background:#fff;border-top:2px solid #e2edf4}
.service:nth-child(1) .symbol,.service:nth-child(2) .symbol,.service:nth-child(3) .symbol,.service:nth-child(4) .symbol{
  background:#edf8ff;color:#168bca;border-radius:14px;box-shadow:none;
}
.service:nth-child(2) .symbol{background:#fff3e7;color:#d77b34}
.service:nth-child(3) .symbol{background:#f1ecff;color:#795dbe}
.service:nth-child(4) .symbol{background:#f1f8e8;color:#719d24}

/* Quick products — a catalogue, not a wall of saturated colour */
.quick-solutions{
  background:
    radial-gradient(circle at 95% 9%,rgba(7,152,247,.07),transparent 21%),
    radial-gradient(circle at 4% 90%,rgba(242,139,69,.07),transparent 24%),
    #f8fbfe;
}
.quick-solutions .head .eyebrow{color:#1687c4}
.quick-solutions .head h2{color:#1d2d3b}
.quick-solutions .head>p{color:#65768a}
.product-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.product-card{
  background:#fff;border:1px solid #e3edf4;border-radius:20px;padding:23px;
  box-shadow:0 8px 28px rgba(32,78,110,.045);
  transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease;
}
.product-card:hover{transform:translateY(-5px);border-color:#c8e6f7;box-shadow:var(--shadow)}
.product-icon{width:44px;height:44px;border-radius:13px;display:grid;place-items:center;background:#e9f7ff;color:#1389c7;font-size:.86rem;font-weight:800;margin-bottom:15px;box-shadow:none}
.product-card:nth-child(3n+2) .product-icon{background:#fff2e7;color:#c97635}
.product-card:nth-child(3n) .product-icon{background:#f1f7e8;color:#6f9b27}
.product-card .plan{font:500 .72rem "DM Mono",monospace;color:#72879a;text-transform:uppercase;letter-spacing:.08em}
.product-card h3{font-size:1.17rem;color:#243a4b;line-height:1.25;letter-spacing:-.04em}
.product-price{font-size:1.8rem;line-height:1.2;letter-spacing:-.06em;color:#147daf;margin:7px 0}
.product-price small{font-size:.72rem;letter-spacing:0;color:#7b8a99;font-weight:600}
.quick-label{display:inline-flex;align-self:flex-start;padding:5px 9px;border-radius:99px;background:#f0f8fd;color:#347597;font-size:.65rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em}
.product-card:nth-child(3n+2) .quick-label{background:#fff4e8;color:#ad6b35}
.product-card ul{display:grid;gap:8px;margin:0 0 19px;padding:0;list-style:none}
.product-card li{position:relative;padding-left:18px;color:#607487;font-size:.81rem;line-height:1.45}
.product-card li:before{content:"✓";position:absolute;left:0;color:#7aab2b;font-weight:800}
.product-card .btn{width:100%;min-height:43px;padding:10px 13px;font-size:.86rem;margin-top:auto}
.product-card .btn.primary{background:var(--brand-blue);border-color:var(--brand-blue)}
.product-card .btn.secondary{background:#fff;border-color:#d5e7f2}
.maintenance-strip{
  display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px;align-items:center;
  margin-top:26px;padding:26px 28px;background:linear-gradient(120deg,#eef8ff,#fff9f2);
  border:1px solid #dcebf4;border-radius:20px;
}
.maintenance-strip h3{font-size:1.18rem;color:#283d4d;margin:0 0 8px}
.maintenance-strip p{font-size:.88rem;color:#63788b;line-height:1.65}
.maintenance-price{font-size:1.55rem;font-weight:800;letter-spacing:-.06em;color:#147daf;white-space:nowrap}
.maintenance-price small{display:block;font-size:.73rem;font-weight:600;letter-spacing:0;color:#718598}
.maintenance-strip .btn{margin-top:10px}
.product-disclaimer{font-size:.78rem;color:#8392a0;line-height:1.75;margin-top:23px}

/* Design graphic portfolio */
.graphic-section{
  position:relative;isolation:isolate;overflow:hidden;
  background:
    radial-gradient(circle at 90% 12%,rgba(242,139,69,.09),transparent 24%),
    radial-gradient(circle at 5% 90%,rgba(7,152,247,.055),transparent 26%),
    #fffaf5;
}
.graphic-section:before{content:"";position:absolute;z-index:-1;top:-120px;right:-90px;width:350px;height:350px;border-radius:50%;border:1px solid rgba(242,139,69,.13);pointer-events:none}
.graphic-intro .head{text-align:left;margin:0;max-width:760px}
.graphic-intro .head .eyebrow{color:#c77b3f}
.graphic-intro .head h2{color:#203442}
.graphic-intro .head>p{color:#647789}
.graphic-intro .inclusion{display:inline-flex;background:#f2f8e9;color:#648a27;border:1px solid #e5efda;border-radius:99px;padding:8px 11px;font-size:.75rem}
.graphic-grid{gap:18px}
.graphic-card{border:1px solid #e7edf1;border-radius:20px;padding:17px;box-shadow:0 10px 28px rgba(38,91,130,.045);transition:transform .24s ease,box-shadow .24s ease}
.graphic-card:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
.graphic-art{height:190px;border-radius:14px;overflow:hidden}
.logo-art{background:linear-gradient(145deg,#e9f8ff,#e3f3f6);color:#294353}
.logo-art .fruit-mark{background:linear-gradient(135deg,#b2d757,#7cb52d);box-shadow:18px 13px 0 -7px #f6b354,-12px 20px 0 -8px #ee866a}
.logo-art strong{color:#1d3444}
.logo-art small{color:#667d8c}
.poster-art{background:linear-gradient(135deg,#fff0d9,#ffe4cb);color:#57404b}
.poster-art:before{border-color:rgba(255,255,255,.72)}
.poster-art:after{background:#f0a080}
.poster-art small{background:#fff9f1;color:#875c48}
.flyer-art{background:#eaf8fb}
.flyer-sheet{box-shadow:8px 9px 0 rgba(77,139,164,.12)}
.flyer-sheet strong{color:#28404c}
.flyer-burst{background:#f2a16f;color:#fff}
.graphic-card h3{font-size:1.1rem;color:#263b4a;margin:2px 0 8px}
.graphic-card p{color:#647789;font-size:.86rem;line-height:1.65}
.graphic-tags{gap:6px}
.graphic-tags span{font-size:.69rem;background:#edf7fc;color:#43768e}
.graphic-card:nth-child(2) .graphic-tags span{background:#fff0e3;color:#a66c3e}
.graphic-card:nth-child(3) .graphic-tags span{background:#f0f7e6;color:#688b35}
.graphic-bottom{
  background:#fff;border:1px solid #e0eaf1;border-radius:18px;padding:24px 26px;
  box-shadow:0 12px 34px rgba(38,91,130,.055);color:var(--ink);
}
.graphic-bottom p{color:#62778a;font-size:.9rem;line-height:1.65}
.graphic-bottom p strong{color:#293e4e}
.graphic-bottom .btn{background:var(--brand-blue);border:1px solid var(--brand-blue);color:#fff}

/* Process, FAQ and contact */
.process{background:#fff}
.step{border-top:2px solid #deebf3}
.step b{display:inline-flex;align-items:center;justify-content:center;min-width:34px;height:28px;padding:0 8px;border-radius:99px;background:#e9f7ff;color:#1685bf;font:500 .73rem "DM Mono",monospace}
.step:nth-child(2) b{background:#fff2e7;color:#c8793c}
.step:nth-child(3) b{background:#f1ecff;color:#765bb6}
.step:nth-child(4) b{background:#f1f8e8;color:#6f9928}
.step h3{font-size:1.12rem;color:#2a4050}
.cta{
  background:linear-gradient(125deg,#f0f9ff,#fff6ee);
  border:1px solid #deebf4;border-radius:24px;box-shadow:var(--shadow);padding:clamp(28px,5vw,54px);
}
.cta .eyebrow{color:#1685bf!important}
.cta h2{color:#203442}
.cta p{color:#63778a}
.cta .btn{background:var(--brand-blue);color:#fff;border:1px solid var(--brand-blue);box-shadow:0 8px 20px rgba(7,152,247,.18)}
#faq{background:#f5faff}
#faq .head h2{color:#203442}
#faq .faqs details{background:#fff;border:1px solid #e1ebf3;border-radius:14px;box-shadow:0 5px 20px rgba(38,91,130,.035)}
#faq .faqs summary{color:#2a4050}
#faq .faqs summary:after{color:#1593d8}
.contact{
  background:
    radial-gradient(circle at 90% 12%,rgba(7,152,247,.07),transparent 24%),
    linear-gradient(180deg,#edf8ff,#f9fcff);
}
.contact .eyebrow{color:#1487c7}
.contact-grid{gap:clamp(26px,5vw,65px)}
.contact-grid h2{color:#203442;font-size:clamp(2rem,4.1vw,3.1rem);line-height:1.08;letter-spacing:-.06em}
.contact-grid>div>p{color:#607589}
.contact-grid>div>p strong{color:#203c4f}
.contact-grid .muted{color:#6e8092}
.form-card{background:#fff;border:1px solid #e0eaf1;border-radius:22px;box-shadow:0 18px 48px rgba(38,91,130,.09);padding:26px}
.field label{color:#40586a;font-size:.82rem;font-weight:700}
.field input,.field select,.field textarea{background:#fbfdff;border:1px solid #dce7ef;border-radius:11px;color:#203442}
.field input:focus,.field select:focus,.field textarea:focus{border-color:#72c5f3;box-shadow:0 0 0 3px rgba(7,152,247,.1)}
.form-card button{border-radius:11px;min-height:47px}
.smallprint{color:#8190a0}
.foot{background:#f5faff;border-top:1px solid #dfeaf2}
.foot .brand img.brand-logo{width:176px;max-height:64px}
.foot p{color:#687d8f}
.foot-links a{color:#526b7e;transition:color .18s ease}
.foot-links a:hover{color:#0877df}
.foot-bottom{border-top-color:#e0eaf1;color:#7d8e9d}
.launcher{background:#25d366;box-shadow:0 10px 28px rgba(23,151,80,.25);border:2px solid #fff;transition:transform .2s,box-shadow .2s}
.launcher:hover{transform:translateY(-3px);box-shadow:0 15px 34px rgba(23,151,80,.3)}
.bubble-label{border:1px solid #dce7ef;color:#304e62;box-shadow:0 8px 22px rgba(35,85,119,.1)}
.chat{background:#fff;border:1px solid #dce7ef;box-shadow:0 22px 60px rgba(22,62,92,.2);border-radius:20px;overflow:hidden}
.chat-head{background:linear-gradient(115deg,#0877df,#1599dc)}
.avatar{background:#fff;color:#0877df}
.chat-body button{background:#25d366;color:#fff}

/* Subtle motion. No motion is required to understand or use the page. */
@keyframes heroFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@keyframes enterUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
.hero-grid>div:first-child{animation:enterUp .7s cubic-bezier(.2,.7,.25,1) both}
.hero .illustration{animation:heroFloat 7s ease-in-out infinite,enterUp .8s .1s cubic-bezier(.2,.7,.25,1) both}
.motion-ready .reveal-on-scroll{opacity:0;transform:translateY(16px);transition:opacity .65s cubic-bezier(.2,.7,.25,1),transform .65s cubic-bezier(.2,.7,.25,1)}
.motion-ready .reveal-on-scroll.is-visible{opacity:1;transform:translateY(0)}
.motion-ready .reveal-on-scroll[data-delay="1"]{transition-delay:70ms}
.motion-ready .reveal-on-scroll[data-delay="2"]{transition-delay:130ms}
.motion-ready .reveal-on-scroll[data-delay="3"]{transition-delay:190ms}
@media(max-width:1050px){
  .links{gap:11px}.links>a:not(.btn){font-size:.82rem}
  .brand img.brand-logo{width:155px}
  .hero-grid{grid-template-columns:minmax(0,1fr) minmax(300px,.85fr);gap:32px}
  .product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:900px){
  nav{height:76px}
  .links{background:rgba(255,255,255,.98);border:1px solid #e2edf4;border-top:0;border-radius:0 0 16px 16px;box-shadow:0 16px 30px rgba(34,78,107,.12);padding:15px 22px 20px}
  .links>a:not(.btn){color:#425a6e;padding:10px 0}
  .hero{padding:60px 0 55px}
  .hero-grid{grid-template-columns:1fr;gap:36px}
  .hero-grid>div:first-child{max-width:760px}
  .illustration{width:min(100%,550px);margin:0 auto}
  .landscape{aspect-ratio:1.35}
  .head{margin-bottom:30px}
  .card.featured{transform:none}
  .graphic-intro{align-items:flex-start}
  .graphic-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:680px){
  nav{height:70px}.brand img.brand-logo{width:148px;max-height:55px}
  .links{top:69px}.nav-shell .hamb{background:#fff;border:1px solid #d8e8f3;color:#32556e;border-radius:10px}
  .hero{padding:45px 0 40px}
  .hero h1{font-size:clamp(2.75rem,12.5vw,4rem);line-height:1.01;letter-spacing:-.07em}
  .hero-grid>div:first-child>p{font-size:1rem}
  .hero .actions .btn{flex:1 1 100%}
  .hero .checks{gap:9px 14px;font-size:.78rem}
  .landscape{aspect-ratio:1.08}
  .s1{left:-1%;top:9%}.s2{right:-1%;bottom:16%}.sticker{font-size:.72rem;padding:10px 12px}
  .note{left:5%;bottom:2%;max-width:205px;padding:12px 14px}
  .proof{padding:17px 0}
  .proof-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;font-size:.82rem}
  .proof-grid>div{justify-content:flex-start}
  .section{padding:66px 0}
  .head h2{font-size:clamp(1.9rem,8vw,2.5rem)}
  .cards{grid-template-columns:1fr}
  .card,.product-card{padding:22px}
  .card>p{min-height:0}
  .product-grid{grid-template-columns:1fr}
  .maintenance-strip{grid-template-columns:1fr;gap:12px;padding:22px}
  .maintenance-price{font-size:1.48rem}
  .graphic-intro{gap:15px;flex-direction:column}
  .graphic-intro .head{text-align:left}
  .graphic-grid{grid-template-columns:1fr}
  .graphic-art{height:210px}
  .graphic-bottom{grid-template-columns:1fr;gap:15px;padding:21px}
  .graphic-bottom .btn{width:100%}
  .cta{padding:26px 22px}
  .contact-grid{grid-template-columns:1fr;gap:25px}
  .form-card{padding:21px}
  .foot .brand img.brand-logo{width:150px}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .motion-ready .reveal-on-scroll{opacity:1;transform:none}
}

/* Original Durazno hero art: an actual storefront preview, not a personal-portfolio landscape */
.hero{padding:clamp(84px,9vw,124px) 0 clamp(70px,7vw,95px)}
.hero-grid{grid-template-columns:minmax(0,1fr) minmax(420px,1.05fr);gap:clamp(38px,5vw,76px)}
.hero h1{font-size:clamp(3.65rem,6.8vw,6.7rem);line-height:.91;max-width:800px;letter-spacing:-.082em;margin-bottom:27px}
.hero h1 em{position:relative;display:inline-block;color:#0877df}
.hero h1 em:after{content:"";position:absolute;left:0;right:0;bottom:-.06em;height:.1em;border-radius:99px;background:linear-gradient(90deg,#f7b56a,#f4d98d);transform:scaleX(.05);transform-origin:left;animation:headlineUnderline .8s .55s cubic-bezier(.2,.7,.2,1) forwards}
.hero-grid>div:first-child>p{font-size:1.12rem;max-width:570px;line-height:1.8;margin-bottom:30px}
.hero .actions .btn{min-height:52px;padding:0 22px}
.hero .actions .btn.primary{gap:12px}
.hero-proof-note{display:flex;align-items:center;gap:9px;margin-top:23px;color:#8091a0;font-size:.79rem;letter-spacing:.01em}
.proof-dot{width:7px;height:7px;border-radius:50%;background:#7fb53c;box-shadow:0 0 0 5px #7fb53c18}
.illustration{position:relative;min-height:570px;display:flex;align-items:center;justify-content:center;animation:none;isolation:isolate;overflow:visible}
.stage-orbit{position:absolute;z-index:-1;border:1px solid rgba(7,152,247,.14);border-radius:50%;pointer-events:none}
.orbit-one{width:510px;height:510px;max-width:100%;animation:orbitBreathe 8s ease-in-out infinite}
.orbit-two{width:425px;height:425px;max-width:90%;border-color:rgba(242,139,69,.19);animation:orbitBreathe 9s ease-in-out infinite reverse}
.website-window{position:relative;z-index:1;width:min(100%,510px);overflow:hidden;background:#fff;border:1px solid #dce9f2;border-radius:19px;box-shadow:0 32px 80px rgba(41,100,138,.17),0 4px 14px rgba(28,60,83,.04);transform:rotate(-2deg);animation:windowReveal .9s .1s cubic-bezier(.2,.8,.2,1) both;transition:transform .35s ease,box-shadow .35s ease}
.website-window:hover{transform:rotate(0deg) translateY(-4px);box-shadow:0 40px 95px rgba(41,100,138,.2)}
.window-top{height:39px;display:flex;align-items:center;gap:15px;padding:0 13px;background:#fbfdff;border-bottom:1px solid #e9f0f5}
.window-dots{display:flex;gap:5px;align-items:center}.window-dots i{width:7px;height:7px;border-radius:50%;background:#e7a18a}.window-dots i:nth-child(2){background:#f0d27b}.window-dots i:nth-child(3){background:#a5ce82}
.browser-address{margin:auto;padding:5px 35px;border-radius:6px;background:#f0f5f8;color:#8797a6;font-size:.6rem;text-align:center}
.live-label{display:flex;align-items:center;gap:5px;color:#7a9b4c;font:500 .56rem "DM Mono",monospace;white-space:nowrap}.live-label i{width:5px;height:5px;border-radius:50%;background:#8cbd48}
.website-canvas{padding:0 22px 20px;background:#fff}
.mini-nav{min-height:48px;display:flex;align-items:center;justify-content:space-between;gap:10px;border-bottom:1px solid #f0f2ef}
.mini-brand{display:flex;align-items:center;gap:7px;font-size:.63rem;letter-spacing:.04em;color:#293f46}
.mini-brand-mark{width:18px;height:18px;border-radius:7px 7px 7px 3px;background:linear-gradient(135deg,#88b946,#c0d98e);position:relative}
.mini-brand-mark:after{content:"";position:absolute;width:7px;height:7px;border-radius:50%;background:#f2a06e;right:-2px;top:-2px}
.mini-nav-links{display:flex;align-items:center;gap:11px;font-size:.55rem;color:#718084}
.mini-menu-cta{padding:7px 9px;border-radius:7px;background:#243d40;color:white;font-weight:700}
.mini-hero{display:grid;grid-template-columns:1.05fr .95fr;min-height:248px;align-items:center;gap:7px;padding:17px 0 11px}
.mini-copy>small{color:#c47b4f;font:500 .54rem "DM Mono",monospace;letter-spacing:.12em}
.mini-copy h2{font-size:clamp(1.9rem,3.2vw,2.65rem);line-height:.98;letter-spacing:-.075em;color:#263e40;margin:9px 0 8px}
.mini-copy h2 em{font-style:normal;color:#e58d5c}
.mini-copy p{font-size:.65rem;color:#7a8584;line-height:1.45;margin:0 0 13px}
.mini-cta{display:inline-flex;align-items:center;gap:9px;padding:9px 11px;background:#203e40;color:white;font-size:.58rem;font-weight:700;border-radius:7px}
.mini-cta b{color:#d5e8a4}
.coffee-visual{position:relative;min-height:205px;overflow:hidden;border-radius:110px 110px 18px 18px;background:linear-gradient(148deg,#f5e9d6,#f4d7bf 62%,#f8ead8)}
.coffee-sun{position:absolute;width:120px;height:120px;top:18px;left:50%;transform:translateX(-50%);border-radius:50%;background:#f1bf8b}
.coffee-plate{position:absolute;z-index:2;width:130px;height:45px;left:50%;bottom:32px;transform:translateX(-50%);border-radius:50%;background:#fff6e9;border:5px solid #e4c9aa;box-shadow:0 9px 17px #a7755230}
.coffee-cup{position:absolute;z-index:3;width:72px;height:64px;left:50%;bottom:51px;transform:translateX(-50%);border-radius:8px 8px 24px 24px;background:linear-gradient(90deg,#fffdf5,#f1e6d5);box-shadow:inset -7px -4px 0 #dbcbb5}
.coffee-cup:after{content:"";position:absolute;right:-19px;top:11px;width:22px;height:25px;border:6px solid #f0e4d3;border-left:0;border-radius:0 16px 16px 0}
.coffee-latte{position:absolute;top:5px;left:7px;right:7px;height:15px;border-radius:50%;background:radial-gradient(ellipse at 50% 45%,#f7e6c8 0 20%,#b47b4b 23% 32%,#ead2b0 36% 42%,#8f5b39 47%);border:2px solid #bb8f6b}
.coffee-bean{position:absolute;z-index:4;width:17px;height:9px;border-radius:50%;background:#7d503a;transform:rotate(40deg)}.coffee-bean:after{content:"";position:absolute;left:8px;top:1px;height:7px;border-left:1px solid #c59b79;transform:rotate(10deg)}
.bean-one{left:16%;bottom:39px}.bean-two{right:16%;bottom:70px;transform:rotate(-23deg)}
.coffee-leaf{position:absolute;width:47px;height:24px;right:8px;top:34px;border-radius:100% 0 100% 0;background:#a9c18c;transform:rotate(-18deg);opacity:.85}
.mini-bottom{border-top:1px solid #edf1e9;padding-top:13px;display:flex;justify-content:space-between;gap:9px;color:#7a8885;font-size:.5rem}
.mini-bottom b{color:#7ba84a;margin-right:4px}
.float-card{position:absolute;z-index:3;display:flex;align-items:center;gap:11px;border:1px solid rgba(220,234,243,.95);border-radius:15px;padding:13px 15px;background:rgba(255,255,255,.96);box-shadow:0 17px 42px rgba(45,97,128,.14);backdrop-filter:blur(14px);animation:floatCard 5.5s ease-in-out infinite}
.float-copy{display:grid;gap:4px}.float-copy>small{font:500 .58rem "DM Mono",monospace;letter-spacing:.06em;color:#8794a0}.float-copy>strong{font-size:.79rem;letter-spacing:-.02em;color:#2a3d49;white-space:nowrap}.float-copy>strong small{font-size:.63rem;color:#7d8e9a}
.float-icon{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:#e8f7ff;color:#078acb;font-size:1.15rem}
.contact-float{top:13%;right:-2%;animation-delay:-1.7s}
.float-pulse{width:7px;height:7px;border-radius:50%;background:#7ebb41;box-shadow:0 0 0 5px #7ebb4119}
.price-float{left:-4%;bottom:20%;animation-delay:-3.5s}
.price-mark{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:#fff0e5;color:#c87940;font-weight:800;font-size:1rem}
.mobile-float{right:1%;bottom:7%;animation-delay:-.8s}
.mobile-icon{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:#eff7e8;color:#719b39;font-size:1.15rem}
.mobile-check{display:grid;place-items:center;width:21px;height:21px;border-radius:50%;background:#eaf7dc;color:#639d29;font-size:.73rem;font-weight:800}
.stage-spark{position:absolute;z-index:2;color:#efae79;pointer-events:none}
.spark-one{left:12%;top:11%;font-size:1.7rem;animation:sparkTurn 12s linear infinite}
.spark-two{right:12%;top:26%;font-size:1.05rem;color:#7bbbe2;animation:sparkPulse 3s ease-in-out infinite}
.brand-marquee{overflow:hidden;background:#fff;border-top:1px solid #e8f0f5;border-bottom:1px solid #e8f0f5;padding:15px 0}
.marquee-track{display:flex;align-items:center;gap:27px;width:max-content;white-space:nowrap;animation:marqueeSlide 33s linear infinite;color:#72889a;font:500 .73rem "DM Mono",monospace;letter-spacing:.11em;text-transform:uppercase}
.marquee-track i{font-style:normal;color:#efa46e;font-size:.9rem}
.brand-marquee:hover .marquee-track{animation-play-state:paused}
@keyframes headlineUnderline{to{transform:scaleX(1)}}
@keyframes windowReveal{from{opacity:0;transform:translateY(18px) rotate(-4deg)}to{opacity:1;transform:translateY(0) rotate(-2deg)}}
@keyframes floatCard{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
@keyframes orbitBreathe{0%,100%{transform:scale(.98);opacity:.7}50%{transform:scale(1.04);opacity:1}}
@keyframes sparkTurn{0%,100%{transform:rotate(0) scale(1)}50%{transform:rotate(18deg) scale(1.16)}}
@keyframes sparkPulse{0%,100%{transform:scale(.8);opacity:.45}50%{transform:scale(1.22);opacity:1}}
@keyframes marqueeSlide{from{transform:translateX(0)}to{transform:translateX(-50%)}}


/* Final type scale tune: larger headings without sacrificing mobile balance */
.head h2{font-size:clamp(2.2rem,4.55vw,3.6rem);line-height:1.04;letter-spacing:-.065em}
.card h3{font-size:1.34rem;line-height:1.22}
.product-card h3{font-size:1.24rem;line-height:1.22}
.graphic-card h3{font-size:1.2rem;line-height:1.25}
@media(max-width:680px){
  .hero h1{font-size:clamp(2.8rem,12.5vw,4.15rem);line-height:.96;letter-spacing:-.075em}
  .head h2{font-size:clamp(2rem,8.8vw,2.85rem);line-height:1.06}
  .card h3,.product-card h3{font-size:1.22rem}
  .graphic-card h3{font-size:1.18rem}
}


/* IMAGE PLACEHOLDERS — empty, labelled slots for assets to create one by one. */
.image-placeholder{
  position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;
  align-items:stretch;justify-content:space-between;color:#718496;background:#f4f8fb;
  border:1px dashed #c7d8e4;border-radius:18px;box-shadow:inset 0 0 0 5px rgba(255,255,255,.55);
}
.image-placeholder:before{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(circle at 78% 12%,rgba(7,152,247,.045),transparent 27%),
             radial-gradient(circle at 8% 90%,rgba(242,139,69,.045),transparent 25%);
}
.placeholder-meta,.placeholder-footer{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  color:#8b9baa;font:500 .63rem "DM Mono",ui-monospace,monospace;letter-spacing:.06em;text-transform:uppercase;
}
.placeholder-meta{padding:14px 16px 0}
.placeholder-footer{padding:0 16px 14px;letter-spacing:.025em;text-transform:none}
.placeholder-main{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1;gap:9px;padding:20px;text-align:center;min-width:0}
.placeholder-glyph{display:block;width:38px;height:38px;color:#a0b6c6;flex:0 0 auto}
.placeholder-kicker{font:500 .62rem "DM Mono",ui-monospace,monospace;letter-spacing:.1em;color:#7b96a9;text-transform:uppercase}
.placeholder-main strong{font-size:1rem;line-height:1.25;font-weight:650;letter-spacing:-.025em;color:#536b7d}
.placeholder-main p{max-width:250px;margin:0;color:#8a9aa8;font-size:.8rem;line-height:1.5}
.placeholder-ratio{align-self:flex-end;padding:0 13px 12px;color:#93a3b1;font:500 .58rem "DM Mono",ui-monospace,monospace;letter-spacing:.06em}
.hero-image-placeholder{width:100%;min-height:440px;aspect-ratio:4/3;border-radius:24px;box-shadow:0 18px 44px rgba(38,91,130,.055);animation:placeholderArrive .7s cubic-bezier(.2,.7,.25,1) both}
.hero-image-placeholder .placeholder-glyph{width:48px;height:48px}
.hero-image-placeholder .placeholder-main{gap:12px}
.hero-image-placeholder .placeholder-main strong{font-size:clamp(1.2rem,2vw,1.55rem);color:#526c80}
.graphic-art.image-placeholder{height:190px;min-height:190px;aspect-ratio:4/3;border-radius:14px;box-shadow:none}
.graphic-art.image-placeholder .placeholder-main{gap:7px;padding:15px}
.graphic-art.image-placeholder .placeholder-glyph{width:32px;height:32px}
.graphic-art.image-placeholder .placeholder-main strong{font-size:.91rem}
.graphic-art.image-placeholder .placeholder-main p{font-size:.72rem}
.graphic-art.image-placeholder .placeholder-ratio{padding-bottom:10px}
.product-image-placeholder{width:100%;aspect-ratio:16/10;min-height:150px;border-radius:14px;margin-bottom:18px;box-shadow:none;background:#f7fafc}
.product-image-placeholder .placeholder-main{gap:7px;padding:14px}
.product-image-placeholder .placeholder-glyph{width:29px;height:29px}
.product-image-placeholder .placeholder-kicker{font-size:.57rem}
.product-image-placeholder .placeholder-main strong{font-size:.89rem}
.product-image-placeholder .placeholder-main p{font-size:.71rem;line-height:1.4}
.product-image-placeholder .placeholder-ratio{font-size:.53rem;padding:0 10px 9px}
.image-slot-note{margin:20px 0 0;padding:12px 15px;border:1px solid #e2ebf2;border-radius:12px;background:#fff;color:#7b8b99;font-size:.78rem;line-height:1.6}
.image-slot-note strong{color:#4e687b}
.image-slot-note code{padding:2px 4px;border-radius:5px;background:#f2f7fa;color:#607b8e;font-size:.72rem}
@keyframes placeholderArrive{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:900px){.hero-image-placeholder{min-height:360px}.graphic-art.image-placeholder{height:210px;min-height:210px}}
@media(max-width:680px){
  .hero-image-placeholder{min-height:320px;aspect-ratio:1/1}
  .hero-image-placeholder .placeholder-meta,.hero-image-placeholder .placeholder-footer{padding-left:12px;padding-right:12px}
  .hero-image-placeholder .placeholder-footer{font-size:.55rem}
  .product-image-placeholder{min-height:170px}
  .graphic-art.image-placeholder{height:210px;min-height:210px}
}
@media(prefers-reduced-motion:reduce){.hero-image-placeholder{animation:none}}


/* Original brand logo as a floating edge tab */
.durazno-floating-tab{
  position:fixed;
  z-index:24;
  top:42%;
  right:0;
  width:112px;
  padding:9px 8px 9px 11px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:5px;
  text-decoration:none;
  background:rgba(255,255,255,.96);
  border:1px solid rgba(218,232,242,.95);
  border-right:0;
  border-radius:17px 0 0 17px;
  box-shadow:0 12px 32px rgba(38,91,130,.13);
  backdrop-filter:blur(12px);
  animation:duraznoTabFloat 5.4s ease-in-out infinite;
  transition:transform .25s ease,box-shadow .25s ease,background .25s ease;
}
.durazno-floating-tab img{
  display:block;
  width:100%;
  height:auto;
  border-radius:9px;
  mix-blend-mode:multiply;
}
.durazno-tab-caption{
  display:block;
  max-width:100%;
  color:#7b8c9b;
  font:500 .56rem "DM Mono",ui-monospace,monospace;
  text-align:center;
  line-height:1.35;
  letter-spacing:.02em;
  opacity:0;
  max-height:0;
  overflow:hidden;
  transition:opacity .2s ease,max-height .2s ease;
}
.durazno-floating-tab:hover,
.durazno-floating-tab:focus-visible{
  transform:translateX(-7px) translateY(-2px);
  box-shadow:0 16px 38px rgba(38,91,130,.18);
  background:#fff;
}
.durazno-floating-tab:hover .durazno-tab-caption,
.durazno-floating-tab:focus-visible .durazno-tab-caption{
  opacity:1;
  max-height:2rem;
}
.durazno-floating-tab:focus-visible{outline-offset:-4px}
@keyframes duraznoTabFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-6px)}
}
@media(max-width:680px){
  .durazno-floating-tab{
    top:35%;
    width:67px;
    padding:6px 5px 6px 7px;
    border-radius:13px 0 0 13px;
    box-shadow:0 8px 20px rgba(38,91,130,.12);
  }
  .durazno-tab-caption{display:none}
  .durazno-floating-tab:hover,
  .durazno-floating-tab:focus-visible{transform:translateX(-3px)}
}
@media(prefers-reduced-motion:reduce){
  .durazno-floating-tab{animation:none;transition:none}
}


/* FINAL BRAND + TYPOGRAPHY PASS
   Accent color: Durazno raspberry #dd0640. Typeface system: Plus Jakarta Sans + Space Grotesk.
   Keep the original logo's orange, yellow and green intact. */
:root{
  --brand-blue:#dd0640;
  --brand-blue-strong:#b80536;
  --brand-blue-soft:#fff0f4;
  --cyan:#dd0640;
  --brand-raspberry:#dd0640;
  --brand-raspberry-dark:#b80536;
  --brand-raspberry-mid:#ee3564;
  --brand-raspberry-light:#f65d82;
  --brand-raspberry-tint:#fff0f4;
}
/* Strict sans-serif type system, including controls and UI elements. */
html,body,button,input,textarea,select{
  font-family:"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
}
body,body p,body a,body button,body input,body textarea,body select,body label,
body li,body small,body summary,body span,body .muted,body .fine,body .smallprint,
body .product-disclaimer,body .image-slot-note{
  font-family:"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
}
h1,h2,h3,h4,h5,h6,
.hero h1,.head h2,.card h3,.product-card h3,.graphic-card h3,
.cta h2,.contact-grid h2,.step h3,.mini-copy h2,
.card .price,.price,.product-price,.brand{
  font-family:"Space Grotesk","Plus Jakarta Sans",system-ui,sans-serif;
  font-synthesis:none;
}
.eyebrow,.hero .eyebrow,.section .eyebrow,.plan,.card .plan,
.placeholder-meta,.placeholder-footer,.placeholder-kicker,.placeholder-ratio,
.durazno-tab-caption,.browser-address,.live-label,.marquee-track{
  font-family:"DM Mono",ui-monospace,monospace;
}
/* Raspberry accents replace interface blues; large surfaces remain quiet and light. */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline-color:#dd0640;
}
::selection{background:#ffd3df;color:#65051f}
.links>a:not(.btn):hover,.foot-links a:hover{color:#dd0640}
.btn.primary,.primary,.cta .btn,.product-card .btn.primary,.form-card button.btn.primary{
  background:linear-gradient(115deg,#dd0640 0%,#ee3564 55%,#f65d82 100%);
  border-color:#dd0640;color:#fff;
  box-shadow:0 9px 24px rgba(221,6,64,.18);
}
.btn.primary:hover,.primary:hover,.cta .btn:hover,.product-card .btn.primary:hover,.form-card button.btn.primary:hover{
  background:linear-gradient(115deg,#b80536 0%,#dd0640 58%,#f04b75 100%);
  box-shadow:0 12px 29px rgba(221,6,64,.23);
}
.btn.secondary,.secondary{border-color:#f0c5d0}
.btn.secondary:hover,.secondary:hover{background:#fff2f5;border-color:#e999af;color:#a50b35}
.hero{
  background:
    radial-gradient(circle at 76% 20%,rgba(221,6,64,.055),transparent 23%),
    radial-gradient(circle at 87% 83%,rgba(242,139,69,.075),transparent 25%),
    linear-gradient(180deg,#fffafd 0%,#fffdf9 100%);
}
.hero:after{border-color:rgba(221,6,64,.10);background:radial-gradient(circle,rgba(221,6,64,.04),rgba(221,6,64,0) 68%)}
.hero .eyebrow{border-color:#f7d9e1;background:#fff4f7}
.hero .eyebrow:before{background:#dd0640;box-shadow:0 0 0 4px #ffe4eb}
.hero h1 em{color:#dd0640}
.hero h1 em:after{background:linear-gradient(90deg,#dd0640,#f04f7a 58%,#ff9db5)}
.proof b{background:#fff0f4;color:#dd0640}
.card:hover{border-color:#efc3d0}
.card.featured{border-color:#ef9db3;box-shadow:0 18px 48px rgba(221,6,64,.09)}
.card.featured:before{background:linear-gradient(90deg,#dd0640,#f04f7a,#ffafc2)}
.card .tag{background:#fff0f4;color:#b80536}
.product-card:hover{border-color:#efc1ce}
.quick-solutions{
  background:
    radial-gradient(circle at 95% 9%,rgba(221,6,64,.055),transparent 21%),
    radial-gradient(circle at 4% 90%,rgba(242,139,69,.055),transparent 24%),
    #fffafd;
}
.quick-solutions .head .eyebrow{color:#dd0640}
.product-card:nth-child(3n+1) .product-icon{background:#fff0f4;color:#dd0640}
.product-card:nth-child(3n+2) .product-icon{background:#fff3e7;color:#c97635}
.product-card:nth-child(3n) .product-icon{background:#f1f7e8;color:#6f9b27}
.product-price{color:#dd0640}
.product-card:nth-child(4n+2) .product-price{color:#bd214d}
.product-card:nth-child(4n+3) .product-price{color:#dd0640}
.product-card .quick-label{background:#fff0f4;color:#b80536}
.product-card:nth-child(3n+2) .quick-label{background:#fff3e7;color:#ad6b35}
.product-card .btn.secondary{background:#fff;border-color:#f0d0d9;color:#8e2b48}
.product-card .btn.secondary:hover{background:#fff2f5;border-color:#e999af}
.maintenance-strip{background:linear-gradient(120deg,#fff0f4 0%,#fff9f4 62%,#fffdf9 100%);border-color:#f0d4dc}
.maintenance-price{color:#dd0640}
.step b{background:#fff0f4;color:#dd0640}
.step:nth-child(2) b{background:#fff2e7;color:#c8793c}
.step:nth-child(3) b{background:#f1ecff;color:#765bb6}
.step:nth-child(4) b{background:#f1f8e8;color:#6f9928}
.cta{background:linear-gradient(125deg,#fff0f4 0%,#fff6f3 58%,#fffafd 100%);border-color:#f0d4dc;box-shadow:0 20px 58px rgba(221,6,64,.07)}
.cta .eyebrow{color:#dd0640!important}
.cta h2{color:#203442}
.cta .btn{background:linear-gradient(115deg,#dd0640,#ee3564 55%,#f65d82);border-color:#dd0640}
#faq .faqs summary:after{color:#dd0640}
#faq .faqs details:focus-within{border-color:#ed9bb1}
.contact{
  background:
    radial-gradient(circle at 90% 12%,rgba(221,6,64,.05),transparent 24%),
    linear-gradient(180deg,#fff5f8,#fffcfd);
}
.contact .eyebrow{color:#dd0640}
.field input:focus,.field select:focus,.field textarea:focus{border-color:#e88ca5;box-shadow:0 0 0 3px rgba(221,6,64,.09)}
.chat-head{background:linear-gradient(115deg,#b80536 0%,#dd0640 58%,#f04f7a 100%)}
.avatar{background:#fff0f4;color:#dd0640}
.float-icon{background:#fff0f4;color:#dd0640}
.durazno-floating-tab{border-color:#f0d4dc;border-right:0}
.durazno-floating-tab:hover,.durazno-floating-tab:focus-visible{
  border-color:#e9a2b5;border-right:0;box-shadow:0 16px 38px rgba(221,6,64,.13);
}
.durazno-floating-tab:after{
  content:"";position:absolute;left:0;top:15px;bottom:15px;width:3px;
  border-radius:0 4px 4px 0;background:linear-gradient(180deg,#dd0640,#f65d82);
  opacity:.75;transition:opacity .2s ease;
}
.durazno-floating-tab:hover:after,.durazno-floating-tab:focus-visible:after{opacity:1}
@media(prefers-reduced-motion:reduce){.durazno-floating-tab:after{transition:none}}


/* WhatsApp CTA — right-side dock, readable incoming-message cue.
   The label uses the previous text colour as its background, with white text. */
.launcher{
  left:auto;
  right:20px;
  bottom:20px;
  position:fixed;
  isolation:isolate;
  background:#25d366;
  border:2px solid #fff;
  box-shadow:0 12px 30px rgba(24,116,60,.28);
  transform:translateZ(0);
}
.launcher:before{
  content:"";
  position:absolute;
  inset:-7px;
  z-index:-1;
  border:2px solid rgba(37,211,102,.55);
  border-radius:50%;
  animation:whatsappIncomingPulse 2.8s ease-out infinite;
  pointer-events:none;
}
.launcher svg{position:relative;z-index:1}
.launcher:hover{transform:translateY(-3px) scale(1.035);box-shadow:0 16px 38px rgba(24,116,60,.32)}
.bubble-label{
  position:absolute;
  left:auto;
  right:76px;
  top:50%;
  transform:translateY(-50%);
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:4px;
  min-width:max-content;
  max-width:calc(100vw - 120px);
  white-space:normal;
  padding:11px 14px;
  border:1px solid rgba(48,78,98,.12);
  border-radius:13px;
  background:#304e62;
  color:#fff;
  box-shadow:0 12px 30px rgba(24,55,76,.2);
  text-align:left;
  animation:whatsappBubbleIn .65s cubic-bezier(.18,.8,.26,1) both,whatsappBubbleBreathe 4.8s 1s ease-in-out infinite;
  transform-origin:right center;
}
.bubble-label:after{
  content:"";
  position:absolute;
  right:-6px;
  top:calc(50% - 6px);
  width:11px;
  height:11px;
  border-top:1px solid rgba(48,78,98,.12);
  border-right:1px solid rgba(48,78,98,.12);
  border-radius:0 3px 0 0;
  background:#304e62;
  transform:rotate(45deg);
}
.notice-kicker{
  display:inline-flex;
  align-items:center;
  gap:5px;
  font:700 .56rem "DM Mono",ui-monospace,monospace;
  letter-spacing:.1em;
  color:#ffd9e3;
}
.notice-kicker:before{
  content:"";
  width:5px;height:5px;flex:0 0 5px;border-radius:50%;
  background:#ff7e9e;
  box-shadow:0 0 0 3px rgba(255,126,158,.15);
}
.notice-copy{
  color:#fff;
  font:700 .82rem "Plus Jakarta Sans",system-ui,sans-serif;
  letter-spacing:-.015em;
}
.typing-dots{display:flex;gap:3px;align-items:center;height:7px}
.typing-dots i{
  width:4px;height:4px;border-radius:50%;background:#fff;opacity:.5;
  animation:whatsappTyping 1s ease-in-out infinite;
}
.typing-dots i:nth-child(2){animation-delay:.15s}
.typing-dots i:nth-child(3){animation-delay:.3s}
.message-badge{
  position:absolute;
  z-index:3;
  top:-4px;
  right:-3px;
  display:grid;
  place-items:center;
  width:21px;height:21px;
  border-radius:50%;
  border:2px solid #fff;
  background:#dd0640;
  color:#fff;
  font:800 .66rem "Plus Jakarta Sans",system-ui,sans-serif;
  box-shadow:0 4px 12px rgba(221,6,64,.28);
  animation:whatsappBadgePop .6s .5s cubic-bezier(.2,.9,.3,1.4) both,whatsappBadgePulse 2.3s 1.1s ease-in-out infinite;
}
.launcher.chat-opened:before,.launcher.chat-opened .bubble-label,.launcher.chat-opened .message-badge{display:none}
.chat{
  left:auto;
  right:20px;
  bottom:96px;
  z-index:31;
}
@keyframes whatsappIncomingPulse{
  0%{transform:scale(.88);opacity:.85}
  70%,100%{transform:scale(1.34);opacity:0}
}
@keyframes whatsappBubbleIn{
  from{opacity:0;transform:translate(13px,-50%) scale(.92)}
  to{opacity:1;transform:translate(0,-50%) scale(1)}
}
@keyframes whatsappBubbleBreathe{
  0%,88%,100%{box-shadow:0 12px 30px rgba(24,55,76,.2)}
  93%{box-shadow:0 14px 33px rgba(221,6,64,.16)}
}
@keyframes whatsappTyping{
  0%,60%,100%{transform:translateY(0);opacity:.45}
  30%{transform:translateY(-3px);opacity:1}
}
@keyframes whatsappBadgePop{
  from{opacity:0;transform:scale(.45)}
  to{opacity:1;transform:scale(1)}
}
@keyframes whatsappBadgePulse{
  0%,100%{box-shadow:0 4px 12px rgba(221,6,64,.28)}
  50%{box-shadow:0 4px 17px rgba(221,6,64,.52)}
}
@media(max-width:680px){
  .launcher{right:16px;bottom:16px;width:58px;height:58px}
  .bubble-label{right:70px;max-width:calc(100vw - 116px);padding:9px 11px}
  .notice-copy{font-size:.74rem}
  .chat{right:16px;bottom:88px;width:min(360px,calc(100vw - 32px))}
}
@media(prefers-reduced-motion:reduce){
  .launcher:before,.bubble-label,.typing-dots i,.message-badge{animation:none!important}
}


/* Circular Durazno brand sticker, using the supplied 1:1 logo. */
.durazno-floating-tab{
  top:43%;
  right:18px;
  width:92px;
  height:92px;
  padding:4px;
  justify-content:center;
  border:3px solid #fff;
  border-radius:50%;
  background:#fff;
  box-shadow:0 10px 28px rgba(48,78,98,.20),0 0 0 1px rgba(221,6,64,.16);
  overflow:hidden;
  animation:duraznoTabFloat 5s ease-in-out infinite,duraznoStickerGlow 4s ease-in-out infinite;
}
.durazno-floating-tab img{
  display:block;width:100%;height:100%;
  object-fit:cover;object-position:center;border-radius:50%;mix-blend-mode:normal;
}
.durazno-floating-tab:after{
  inset:0;left:0;top:0;bottom:0;width:auto;
  border-radius:50%;border:2px solid rgba(221,6,64,.22);
  background:none;pointer-events:none;
}
.durazno-floating-tab:hover,.durazno-floating-tab:focus-visible{
  transform:translateY(-4px) scale(1.06);
  border-color:#fff;
  box-shadow:0 15px 35px rgba(221,6,64,.19),0 0 0 4px rgba(221,6,64,.08);
}
.durazno-floating-tab .durazno-tab-caption{display:none}
@keyframes duraznoStickerGlow{
  0%,100%{box-shadow:0 10px 28px rgba(48,78,98,.20),0 0 0 1px rgba(221,6,64,.16)}
  50%{box-shadow:0 13px 34px rgba(221,6,64,.14),0 0 0 5px rgba(221,6,64,.055)}
}
@media(max-width:680px){
 .durazno-floating-tab{top:35%;right:12px;width:68px;height:68px;padding:3px;border-width:2px}
}
@media(prefers-reduced-motion:reduce){.durazno-floating-tab{animation:none}}


/* Affordable-solutions direction: the logo returns to the header as a sticker. */
.nav-shell{position:sticky;top:0;z-index:20;overflow:visible}
.nav-shell nav{height:104px;overflow:visible}
.nav-shell .brand{position:relative;z-index:22;display:flex;align-items:center;flex:0 0 158px;width:158px;min-width:158px;height:100%;overflow:visible}
.nav-shell .brand img.brand-logo{
  display:block;width:142px;height:142px;max-height:none;object-fit:contain;
  position:relative;top:18px;left:0;z-index:2;
  border-radius:50%;background:#fff;padding:2px;
  box-shadow:0 12px 30px rgba(35,48,57,.18),0 0 0 1px rgba(221,6,64,.13);
  filter:drop-shadow(0 2px 1px rgba(32,37,33,.05));
  transition:transform .25s ease,box-shadow .25s ease;
}
.nav-shell .brand:hover img.brand-logo{transform:translateY(-3px) rotate(-2deg);box-shadow:0 16px 36px rgba(221,6,64,.15),0 0 0 4px rgba(221,6,64,.055)}
.nav-shell .links{gap:clamp(10px,1.5vw,22px)}
.hero{padding-top:clamp(78px,8vw,108px)}
.hero h1 em{color:#dd0640}
.hero h1 em:after{background:linear-gradient(90deg,#dd0640,#f04f7a 58%,#ff9db5)}
.hero .checks b{color:#dd0640}
.hero-proof-note{color:#68716b}
.proof-dot{background:#dd0640;box-shadow:0 0 0 5px rgba(221,6,64,.09)}

/* Product cards use clearly-labelled sample UI previews instead of a fake client portfolio. */
.product-preview{
  width:100%;aspect-ratio:16/10;min-height:150px;overflow:hidden;
  margin-bottom:18px;border-radius:14px;border:1px solid #e7dfe0;
  background:linear-gradient(145deg,#fff8f3,#fff0f4);
  box-shadow:inset 0 0 0 4px rgba(255,255,255,.75);
  display:flex;flex-direction:column;
}
.preview-top{height:26px;flex:0 0 26px;display:flex;align-items:center;gap:4px;padding:0 10px;background:#fff;border-bottom:1px solid #f0e4e6}
.preview-top i{width:5px;height:5px;border-radius:50%;background:#e9b7c3}
.preview-top i:first-child{background:#dd0640}
.preview-top span{margin-left:auto;font:500 .48rem "DM Mono",monospace;color:#8e7d82;letter-spacing:.03em}
.preview-screen{flex:1;min-height:0;position:relative;display:flex;flex-direction:column;justify-content:center;padding:12px 15px 10px;overflow:hidden}
.preview-screen:after{content:"";position:absolute;right:-23px;top:-38px;width:95px;height:95px;border-radius:50%;background:rgba(221,6,64,.08);pointer-events:none}
.preview-copy{position:relative;z-index:1;display:flex;flex-direction:column;align-items:flex-start;gap:5px}
.preview-kicker{font:700 .43rem "DM Mono",monospace;letter-spacing:.09em;color:#dd0640;text-transform:uppercase}
.preview-copy strong{max-width:95%;font:700 clamp(.8rem,1.1vw,1.05rem)/1.1 "Space Grotesk",sans-serif;letter-spacing:-.045em;color:#28333b}
.preview-copy small{max-width:95%;font-size:.53rem;line-height:1.35;color:#78848b}
.preview-action{align-self:flex-start;position:relative;z-index:1;margin-top:9px;border-radius:5px;padding:5px 8px;background:#dd0640;color:#fff;font:700 .43rem "DM Mono",monospace;letter-spacing:.04em}
.preview-lines{position:absolute;right:14px;bottom:13px;width:29%;display:grid;gap:4px}
.preview-lines i{display:block;height:4px;border-radius:5px;background:rgba(90,111,123,.15)}
.preview-lines i:nth-child(2){width:72%}
.preview-lines i:nth-child(3){width:48%}
.product-preview[data-preview="event-invitation"]{background:linear-gradient(135deg,#f7e7d9,#fff7ed)}
.product-preview[data-preview="event-invitation"] .preview-screen{align-items:center;text-align:center}
.product-preview[data-preview="event-invitation"] .preview-copy{align-items:center}
.product-preview[data-preview="qr-menu"]{background:linear-gradient(135deg,#f2f5e9,#fffdf4)}
.product-preview[data-preview="qr-menu"] .preview-action{background:#47753d}
.product-preview[data-preview="service-landing"]{background:linear-gradient(135deg,#edf4f8,#fff)}
.product-preview[data-preview="service-landing"] .preview-action{background:#304e62}
.product-preview[data-preview="product-catalog"]{background:linear-gradient(135deg,#fff2e0,#fffaf1)}
.product-preview[data-preview="property-catalog"]{background:linear-gradient(135deg,#eaf2f1,#fff)}
.product-preview[data-preview="property-catalog"] .preview-action{background:#47766d}
.product-preview[data-preview="instant-quote"]{background:linear-gradient(135deg,#f2eefa,#fff)}
.product-preview[data-preview="instant-quote"] .preview-action{background:#765bb6}
.product-preview[data-preview="local-guide"]{background:linear-gradient(135deg,#f0f6e6,#fffdf5)}
.product-preview[data-preview="local-guide"] .preview-action{background:#6f9928}
.product-preview[data-preview="digital-business-card"] .preview-screen{padding-left:22px}
.product-preview[data-preview="digital-business-card"] .preview-copy:before{content:"D";display:grid;place-items:center;width:24px;height:24px;margin-bottom:1px;border-radius:50%;background:#dd0640;color:#fff;font:800 .8rem "Space Grotesk",sans-serif}
@media(max-width:1000px){
  .nav-shell nav{height:92px}
  .nav-shell .brand{flex-basis:120px;width:120px;min-width:120px}
  .nav-shell .brand img.brand-logo{width:112px;height:112px;top:12px}
  .nav-shell .links{gap:12px}
}
@media(max-width:680px){
  .nav-shell nav{height:78px}
  .nav-shell .brand{flex:0 0 92px;width:92px;min-width:92px}
  .nav-shell .brand img.brand-logo{width:86px;height:86px;top:7px;padding:1px}
  .nav-shell .links{top:77px}
  .hero{padding-top:50px}
  .product-preview{min-height:178px}
  .preview-copy strong{font-size:1rem}
}
@media(prefers-reduced-motion:reduce){.nav-shell .brand img.brand-logo{transition:none}}


/* Art direction correction: bold orange, restrained type, no warm pastel haze. */
:root{--brand-raspberry:#FA4100;--brand-raspberry-dark:#C93200;--brand-raspberry-mid:#FA4100;--brand-raspberry-light:#FF6A32;--brand-raspberry-tint:#FFF0E9;--cyan:#FA4100}
html,body,button,input,textarea,select,body p,body a,body label,body li,body small,body summary,body span,body .muted,body .fine,body .smallprint,body .product-disclaimer,body .image-slot-note{font-family:Inter,"Segoe UI",Arial,sans-serif}
h1,h2,h3,h4,h5,h6,.hero h1,.head h2,.card h3,.product-card h3,.graphic-card h3,.cta h2,.contact-grid h2,.step h3,.mini-copy h2,.card .price,.price,.product-price,.brand{font-family:Inter,"Segoe UI",Arial,sans-serif;font-synthesis:none}
.hero{background:#fff;padding-top:clamp(54px,6vw,78px);padding-bottom:clamp(54px,6vw,76px)}
.hero:after{border-color:rgba(250,65,0,.17);background:none}
.hero .eyebrow{border-color:#ffd1c1;background:#fff;color:#FA4100}
.hero .eyebrow:before{background:#FA4100;box-shadow:0 0 0 4px rgba(250,65,0,.12)}
.hero h1{font-size:clamp(2.7rem,4.25vw,4.25rem);line-height:1.02;letter-spacing:-.065em;max-width:650px;margin-bottom:22px;font-weight:750}
.hero h1 em{color:#FA4100;font-style:normal}
.hero h1 em:after{height:.075em;background:#FA4100}
.hero-grid{grid-template-columns:minmax(0,1fr) minmax(360px,.92fr);gap:clamp(28px,4vw,58px)}
.hero-grid>div:first-child>p{font-size:1.04rem;line-height:1.75;max-width:560px}
.hero .checks b{color:#FA4100}.hero-proof-note{color:#65717b}.proof-dot{background:#FA4100;box-shadow:0 0 0 5px rgba(250,65,0,.10)}
.btn.primary,.primary,.cta .btn,.product-card .btn.primary,.form-card button.btn.primary{background:#FA4100;border-color:#FA4100;color:#fff;box-shadow:0 8px 20px rgba(250,65,0,.18)}
.btn.primary:hover,.primary:hover,.cta .btn:hover,.product-card .btn.primary:hover,.form-card button.btn.primary:hover{background:#C93200;border-color:#C93200;box-shadow:0 10px 25px rgba(250,65,0,.22)}
.btn.secondary,.secondary{border-color:#ffd0c0}.btn.secondary:hover,.secondary:hover{background:#fff0e9;border-color:#FA4100;color:#9f2c00}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline-color:#FA4100}
::selection{background:#FA4100;color:#fff}.links>a:not(.btn):hover,.foot-links a:hover{color:#FA4100}
.proof b,.card .tag,.product-card .quick-label{background:#fff0e9;color:#C93200}
.card.featured{border-color:#FA4100;box-shadow:0 18px 48px rgba(250,65,0,.09)}.card.featured:before{background:#FA4100}
.product-card:hover{border-color:#ffb49a}
.quick-solutions{background:#f6f7f8}.quick-solutions .head .eyebrow{color:#FA4100}
.product-card:nth-child(3n+1) .product-icon,.product-card:nth-child(3n+2) .product-icon,.product-card:nth-child(3n) .product-icon{background:#fff0e9;color:#FA4100}
.product-price,.product-card:nth-child(4n+2) .product-price,.product-card:nth-child(4n+3) .product-price{color:#FA4100}
.product-card .quick-label,.product-card:nth-child(3n+2) .quick-label{background:#fff0e9;color:#C93200}
.product-card .btn.secondary{border-color:#ffd0c0;color:#9f2c00}.product-card .btn.secondary:hover{background:#fff0e9;border-color:#FA4100}
.maintenance-strip{background:#f6f7f8;border-color:#e5e8eb}.maintenance-price{color:#FA4100}
.step b,.step:nth-child(2) b{background:#fff0e9;color:#FA4100}
.graphic-section{background:#f7f7f7}.graphic-tags span{background:#fff0e9;color:#C93200}
.contact{background:#f5f6f7}.contact .eyebrow{color:#FA4100}
.field input:focus,.field select:focus,.field textarea:focus{border-color:#FA4100;box-shadow:0 0 0 3px rgba(250,65,0,.1)}
.chat-head{background:#FA4100}.avatar{background:#fff;color:#FA4100}.float-icon{background:#fff0e9;color:#FA4100}
@media(max-width:1000px){.hero{padding-top:54px;padding-bottom:54px}.hero-grid{grid-template-columns:minmax(0,1fr) minmax(300px,.9fr);gap:28px}.hero h1{font-size:clamp(2.7rem,5vw,3.8rem)}}
@media(max-width:680px){.hero{padding-top:42px;padding-bottom:42px;background:#fff}.hero-grid{grid-template-columns:1fr;gap:30px}.hero h1{font-size:clamp(2.5rem,10vw,3.25rem);line-height:1.02;letter-spacing:-.06em;max-width:100%;margin-bottom:18px}.hero-grid>div:first-child>p{font-size:1rem;line-height:1.65}}


/* High-contrast art direction: deep blue-green hero, orange CTA, punchy labels. */
.hero{
  color:#fff;
  background:
    radial-gradient(ellipse at 84% 12%,rgba(250,65,0,.26),transparent 32%),
    radial-gradient(ellipse at 12% 100%,rgba(0,201,190,.14),transparent 34%),
    linear-gradient(122deg,#102735 0%,#163b4b 52%,#102c3c 100%);
  padding-top:clamp(54px,6vw,78px);
  padding-bottom:clamp(54px,6vw,76px);
}
.hero:after{
  border:1px solid rgba(255,255,255,.14);
  background:radial-gradient(circle,rgba(250,65,0,.12),transparent 68%);
}
.hero .eyebrow{
  color:#fff;
  background:#FA4100;
  border:1px solid #ff7849;
  border-radius:7px;
  padding:8px 12px;
  font-weight:800;
  letter-spacing:.09em;
  box-shadow:0 6px 22px rgba(250,65,0,.22);
}
.hero .eyebrow:before{background:#FFE45E;box-shadow:0 0 0 4px rgba(255,228,94,.2)}
.hero h1{color:#fff;text-wrap:balance}
.hero h1 em{color:#FFE45E;font-style:normal}
.hero h1 em:after{background:#FA4100;height:.09em}
.hero-grid>div:first-child>p{color:#e1edf2}
.hero .checks{color:#f4f8fa}
.hero .checks b{color:#FFE45E}
.hero-proof-note{color:#d6e6ec}
.proof-dot{background:#FFE45E;box-shadow:0 0 0 5px rgba(255,228,94,.14)}
.hero .btn.primary,.hero .btn.primary:hover{
  color:#fff;background:#FA4100;border-color:#FA4100;
  box-shadow:0 10px 28px rgba(250,65,0,.34);
}
.hero .btn.secondary{
  color:#fff;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.48);
  box-shadow:none;backdrop-filter:blur(6px)
}
.hero .btn.secondary:hover{background:rgba(255,255,255,.15);border-color:#FFE45E;color:#FFE45E}
.hero .hero-image-placeholder{
  background:linear-gradient(145deg,#193d4f,#102b3a);
  border:1px solid rgba(255,255,255,.27);
  color:#fff;
  box-shadow:0 28px 70px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.1);
}
.hero .hero-image-placeholder .placeholder-meta,
.hero .hero-image-placeholder .placeholder-footer{color:#b7d0da}
.hero .hero-image-placeholder .placeholder-kicker{color:#FFE45E}
.hero .hero-image-placeholder .placeholder-glyph{color:#ffb196}
.hero .hero-image-placeholder .placeholder-main strong{color:#fff}
.hero .hero-image-placeholder .placeholder-main p{color:#c7dce4}
.hero .hero-image-placeholder .placeholder-meta span:first-child{
  background:#FA4100;color:#fff;border-radius:4px;padding:4px 7px;
}
/* Labels are signposts: dark ink, vivid orange, or electric yellow—not pale pills. */
.section .eyebrow,.quick-solutions .head .eyebrow{
  display:inline-flex;align-items:center;width:fit-content;
  padding:7px 11px;border-radius:6px;
  background:#FA4100;color:#fff;border:1px solid #FA4100;
  font-weight:800;letter-spacing:.08em;
}
.plan,.placeholder-kicker,.placeholder-ratio,.graphic-tags span,.product-card .quick-label,
.card .tag,.product-disclaimer .tag,.service .tag{
  background:#142f3d!important;color:#fff!important;border:1px solid #142f3d!important;
  border-radius:6px!important;font-weight:800!important;
}
.product-card .quick-label,.card .tag,.graphic-tags span{
  display:inline-flex;align-items:center;gap:5px;padding:6px 9px!important;
}
.product-price,.maintenance-price{color:#FA4100}
.product-icon{background:#FA4100!important;color:#fff!important}
.proof b{background:#FA4100!important;color:#fff!important}
.card.featured{border:2px solid #FA4100;box-shadow:0 16px 38px rgba(250,65,0,.12)}
.card.featured:before{background:#FA4100}
.product-card .quick-label{background:#FA4100!important;border-color:#FA4100!important;color:#fff!important}
.placeholder-meta span,.placeholder-footer span{
  font-weight:800;
}
@media(max-width:680px){
  .hero{padding-top:42px;padding-bottom:42px;background:linear-gradient(145deg,#102735 0%,#163b4b 60%,#102c3c 100%)}
  .hero .eyebrow{font-size:.65rem;letter-spacing:.06em}
}


/* Art direction reset: warm editorial energy, tactile surfaces and real photography. */
:root{
  --brand-raspberry:#FA4100;
  --brand-raspberry-dark:#c93200;
  --brand-raspberry-mid:#FA4100;
  --brand-raspberry-light:#ff6b36;
  --brand-raspberry-tint:#fff0e6;
}
.hero{
  position:relative;isolation:isolate;overflow:hidden;
  color:#fff;
  background:
    radial-gradient(ellipse at 86% 12%,rgba(255,213,75,.42),transparent 27%),
    radial-gradient(ellipse at 5% 96%,rgba(174,28,0,.38),transparent 36%),
    linear-gradient(118deg,#e93600 0%,#fa4100 46%,#ff6b18 100%);
  padding:clamp(58px,7vw,94px) 0 clamp(64px,7vw,92px);
}
.hero:before{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.17;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.24'/%3E%3C/svg%3E");
  mix-blend-mode:soft-light;
}
.hero:after{
  width:560px;height:560px;right:-240px;top:-250px;z-index:-1;
  border:1px solid rgba(255,255,255,.3);
  background:radial-gradient(circle,rgba(255,255,255,.13),transparent 68%);
}
.hero-grid{grid-template-columns:minmax(0,1fr) minmax(360px,.98fr);gap:clamp(28px,4vw,58px)}
.hero .eyebrow{
  display:inline-flex;align-items:center;gap:9px;width:fit-content;
  padding:9px 12px;border-radius:5px;
  background:#142f3d;color:#fff;border:1px solid rgba(255,255,255,.24);
  box-shadow:5px 5px 0 rgba(20,47,61,.2);
  font-size:.68rem;font-weight:800;letter-spacing:.08em;
}
.hero .eyebrow:before{background:#ffdf52;box-shadow:0 0 0 4px rgba(255,223,82,.2)}
.hero h1{color:#fff;font-size:clamp(2.65rem,4.1vw,4.1rem);line-height:1.01;letter-spacing:-.065em;max-width:620px;font-weight:800}
.hero h1 em{color:#ffdf52;font-style:normal}
.hero h1 em:after{height:.085em;background:#142f3d}
.hero-grid>div:first-child>p{color:#fff4ed;max-width:540px;font-size:1.06rem;line-height:1.72}
.hero .checks{color:#fff;font-size:.84rem;gap:12px 17px}
.hero .checks b{color:#ffdf52}
.hero-proof-note{color:#fff0e6}
.proof-dot{background:#ffdf52;box-shadow:0 0 0 5px rgba(255,223,82,.18)}
.hero .btn.primary,.hero .btn.primary:hover{
  background:#142f3d;border-color:#142f3d;color:#fff;
  box-shadow:5px 5px 0 rgba(255,223,82,.8);
  transform:translate(-2px,-2px);
}
.hero .btn.primary:hover{box-shadow:7px 7px 0 rgba(255,223,82,.8)}
.hero .btn.secondary{
  color:#fff;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.62);
  backdrop-filter:blur(8px)
}
.hero .btn.secondary:hover{background:#ffdf52;border-color:#ffdf52;color:#142f3d}
.hero .hero-image-placeholder{
  position:relative;isolation:isolate;overflow:hidden;min-height:clamp(330px,34vw,440px);
  aspect-ratio:4/3;border:7px solid #fff;border-radius:12px;
  background-color:#263e46;
  background-image:
    linear-gradient(180deg,rgba(18,31,38,.02) 25%,rgba(18,31,38,.08) 48%,rgba(18,31,38,.82) 100%),
    url("https://images.unsplash.com/photo-1460925895917-afdab827c52f?auto=format&fit=crop&w=1400&q=85");
  background-size:cover;background-position:center;
  box-shadow:15px 17px 0 rgba(20,47,61,.32),0 28px 65px rgba(105,28,0,.25);
  transform:rotate(1.5deg);transition:transform .35s ease,box-shadow .35s ease;
  animation:heroPhotoArrive .7s ease-out both;
}
.hero .hero-image-placeholder:hover{transform:rotate(0) translateY(-4px);box-shadow:18px 21px 0 rgba(20,47,61,.28),0 34px 72px rgba(105,28,0,.3)}
.hero .hero-image-placeholder>*{display:none!important}
.hero .hero-image-placeholder:before{
  content:"EJEMPLO VISUAL · DISEÑO WEB";
  position:absolute;z-index:2;left:16px;top:16px;
  background:#ffdf52;color:#142f3d;padding:8px 10px;border-radius:4px;
  font:800 .63rem "DM Mono",monospace;letter-spacing:.06em;
  box-shadow:3px 3px 0 rgba(20,47,61,.28);
}
.hero .hero-image-placeholder:after{
  content:"Tu negocio, listo para estar en internet.";
  position:absolute;z-index:2;left:22px;right:22px;bottom:22px;
  color:#fff;font:800 clamp(1.25rem,2.4vw,2rem)/1.05 "Space Grotesk",sans-serif;
  letter-spacing:-.045em;max-width:390px;text-shadow:0 2px 16px rgba(0,0,0,.35);
}
@keyframes heroPhotoArrive{from{opacity:0;transform:translateY(16px) rotate(4deg)}to{opacity:1;transform:rotate(1.5deg)}}

/* Make the product catalogue feel like a shop window, not wireframes. */
.quick-solutions{position:relative;background:#fff7ec;overflow:hidden}
.quick-solutions:before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.24;
  background-image:radial-gradient(#f0a17f .7px,transparent .7px);background-size:12px 12px;
}
.quick-solutions>.wrap{position:relative}
.quick-solutions .head{text-align:left;max-width:820px;margin:0 0 36px}
.quick-solutions .head h2{max-width:750px;color:#142f3d}
.quick-solutions .head>p{margin-left:0;color:#5e6a6e}
.quick-solutions .head .eyebrow{background:#142f3d;color:#fff;border-color:#142f3d;box-shadow:4px 4px 0 #ffdf52}
.product-grid{gap:22px}
.product-card{
  overflow:hidden;padding:0 0 22px!important;
  background:#fff;border:1px solid #e8d8c8;border-radius:12px;
  box-shadow:0 8px 0 rgba(20,47,61,.055),0 16px 38px rgba(77,44,24,.07);
  transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;
}
.product-card:hover{transform:translateY(-6px) rotate(-.3deg);border-color:#fa4100;box-shadow:0 10px 0 rgba(250,65,0,.12),0 24px 45px rgba(77,44,24,.13)}
.product-card>*:not(.product-preview){margin-left:22px;margin-right:22px}
.product-preview{
  position:relative;isolation:isolate;aspect-ratio:1.55;min-height:190px;
  margin:0 0 20px!important;border:0!important;border-radius:0!important;
  overflow:hidden;background-color:#d8d4cb!important;box-shadow:none!important;
  transform:none!important;
}
.product-preview>*{display:none!important}
.product-preview:before{
  content:"VISTA DE EJEMPLO";position:absolute;z-index:2;left:13px;top:13px;
  padding:6px 8px;background:#ffdf52;color:#142f3d;border-radius:4px;
  font:800 .58rem "DM Mono",monospace;letter-spacing:.07em;
  box-shadow:3px 3px 0 rgba(20,47,61,.18)
}
.product-preview:after{
  content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(15,32,39,.02) 20%,rgba(15,32,39,.58) 100%);
  pointer-events:none
}
.product-preview[data-preview="digital-business-card"]{background-image:url("https://images.unsplash.com/photo-1516321318423-f06f85e504b3?auto=format&fit=crop&w=900&q=82")!important;background-size:cover!important;background-position:center!important}
.product-preview[data-preview="event-invitation"]{background-image:url("https://images.unsplash.com/photo-1511795409834-ef04bbd61622?auto=format&fit=crop&w=900&q=82")!important;background-size:cover!important;background-position:center!important}
.product-preview[data-preview="qr-menu"]{background-image:url("https://images.unsplash.com/photo-1517248135467-4c7edcad34c4?auto=format&fit=crop&w=900&q=82")!important;background-size:cover!important;background-position:center!important}
.product-preview[data-preview="service-landing"]{background-image:url("https://images.unsplash.com/photo-1497366754035-f200968a6e72?auto=format&fit=crop&w=900&q=82")!important;background-size:cover!important;background-position:center!important}
.product-preview[data-preview="product-catalog"]{background-image:url("https://images.unsplash.com/photo-1441986300917-64674bd600d8?auto=format&fit=crop&w=900&q=82")!important;background-size:cover!important;background-position:center!important}
.product-preview[data-preview="property-catalog"]{background-image:url("https://images.unsplash.com/photo-1600596542815-ffad4c1539a9?auto=format&fit=crop&w=900&q=82")!important;background-size:cover!important;background-position:center!important}
.product-preview[data-preview="instant-quote"]{background-image:url("https://images.unsplash.com/photo-1554224155-6726b3ff858f?auto=format&fit=crop&w=900&q=82")!important;background-size:cover!important;background-position:center!important}
.product-preview[data-preview="local-guide"]{background-image:url("https://images.unsplash.com/photo-1519501025264-65ba15a82390?auto=format&fit=crop&w=900&q=82")!important;background-size:cover!important;background-position:center!important}
.product-card .quick-label{
  width:fit-content;margin-bottom:10px!important;background:#fa4100!important;color:#fff!important;border:0!important;
  font-size:.65rem!important;letter-spacing:.04em
}
.product-card .plan{display:inline-flex;width:fit-content;margin-bottom:8px!important;background:#142f3d!important;color:#fff!important}
.product-card h3{color:#142f3d;font-size:1.3rem;line-height:1.15;letter-spacing:-.035em}
.product-card p{color:#5e6a6e;line-height:1.65}
.product-card ul{padding-left:22px}
.product-card li::marker{color:#fa4100}
.product-price{font-size:1.65rem;color:#fa4100!important;font-weight:800}
.product-price small{font-size:.72rem;color:#6b777b;font-weight:600}
.product-card .product-choose{margin-top:12px}
.product-card .btn.primary,.product-card .btn.secondary{
  display:inline-flex;background:#142f3d;color:#fff;border-color:#142f3d;border-radius:7px;
  box-shadow:3px 3px 0 #ffdf52
}
.product-card .btn.primary:hover,.product-card .btn.secondary:hover{background:#fa4100;border-color:#fa4100;color:#fff}
.plan,.placeholder-kicker,.placeholder-ratio,.graphic-tags span,.card .tag,.product-disclaimer .tag,.service .tag{
  background:#142f3d!important;color:#fff!important;border:1px solid #142f3d!important;border-radius:4px!important
}
.graphic-section{background:#f3e7d6}
.graphic-section .graphic-tags span{background:#fa4100!important;color:#fff!important;border-color:#fa4100!important}
.pricing{background:#f1f5ef}
.card{border-radius:12px;box-shadow:0 8px 0 rgba(20,47,61,.05),0 18px 38px rgba(20,47,61,.06)}
.card.featured{border:2px solid #fa4100;box-shadow:0 8px 0 rgba(250,65,0,.13),0 20px 42px rgba(20,47,61,.09)}
.card.featured:before{background:#ffdf52;height:6px}
.contact{background:#142f3d;color:#fff}
.contact .head h2,.contact .head>p,.contact .contact-grid h2{color:#fff}
.contact .eyebrow{background:#fa4100;color:#fff}
@media(max-width:1000px){
  .hero-grid{grid-template-columns:minmax(0,1fr) minmax(300px,.9fr);gap:28px}
  .hero .hero-image-placeholder{min-height:330px}
}
@media(max-width:680px){
  .hero{padding:46px 0 54px}
  .hero-grid{grid-template-columns:1fr;gap:34px}
  .hero .hero-image-placeholder{min-height:280px;aspect-ratio:4/3;margin:0 5px}
  .hero .hero-image-placeholder:after{font-size:1.5rem}
  .quick-solutions .head{text-align:left}
  .product-grid{grid-template-columns:1fr}
  .product-preview{min-height:220px}
}
@media(prefers-reduced-motion:reduce){.hero .hero-image-placeholder{animation:none;transition:none}}

/* Keep the tactile grain visible above the hero paint and below its content. */
.hero:before{z-index:0}
.hero:after{z-index:0;pointer-events:none}
.hero-grid{position:relative;z-index:1}