/* =============================================================================
   BORNER — Design System (legacy/public marketing pages)
   Palette: Laurel Green / Bone White / Army Green / Warm Grey / Alabaster
   Typography: Inter (200/300/400/500/600/700)
   ============================================================================= */

:root{
  /* Brand */
  --laurel:#6d827f;
  --laurel-dark:#566866;
  --laurel-soft:#8a9b97;
  --warm-grey:#a3a199;
  --bone:#dedbcf;
  --army:#1c211f;
  --army-soft:#3a4543;
  --army-muted:#5a605d;
  --grey-muted:#7a8682;
  --alabaster:#f5f2f0;

  /* Accent rotation (uso parsimonioso) */
  --camel:#c4a382;
  --wheat:#fad6ab;
  --azulito:#698aad;
  --pumpkin:#e88c59;
  --durazno:#d49c91;
  --ash-brown:#ab8266;

  /* Semantic */
  --ink:var(--army);
  --muted:var(--army-muted);
  --soft:var(--alabaster);
  --stone:var(--bone);
  --line:rgba(28,33,31,.10);
  --line-strong:rgba(28,33,31,.18);
  --white:#ffffff;
  --accent:var(--laurel);
  --accent-soft:var(--laurel-soft);
  --radius:24px;
  --shadow:0 24px 60px rgba(28,33,31,.10);
  --shadow-soft:0 10px 30px rgba(28,33,31,.06);

  --font-sans:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  --font-display:"Inter",-apple-system,sans-serif;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:var(--font-sans);
  color:var(--ink);
  background:var(--alabaster);
  font-size:16.5px;
  line-height:1.6;
  letter-spacing:-.005em;
  font-feature-settings:"ss01","cv11","kern";
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
a{color:inherit;text-decoration:none}

/* ====== Header / Nav ====== */
.site-header{
  position:sticky;top:0;z-index:30;
  background:rgba(245,242,240,.88);
  backdrop-filter:blur(18px);
  border-bottom:1px solid var(--line);
}
.nav{max-width:1220px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:28px;padding:18px 24px}
.wordmark{
  display:block;
  font-family:var(--font-display);
  font-weight:600;
  letter-spacing:-.025em;
  line-height:.88;
  font-size:30px;
  text-transform:none;
  color:var(--ink);
}
.wordmark small{
  display:block;
  font-size:.22em;
  letter-spacing:.18em;
  line-height:1.1;
  text-transform:uppercase;
  margin-top:10px;
  font-weight:600;
  color:var(--grey-muted);
}
.nav-links{display:flex;gap:26px;align-items:center;font-size:14.5px;color:var(--army-soft);font-weight:500}
.nav-links a{padding:8px 0;border-bottom:1px solid transparent;transition:color .18s ease,border-color .18s ease}
.nav-links a:hover,
.nav-links a[aria-current="page"],
.nav-links a.active{border-color:var(--laurel);color:var(--laurel-dark)}
.lang{display:flex;gap:6px;font-size:11.5px;text-transform:uppercase;color:var(--grey-muted);letter-spacing:.08em;font-weight:600}
.lang a{padding:5px 9px;border:1px solid var(--line-strong);border-radius:999px;transition:all .18s ease}
.lang a:hover{border-color:var(--laurel);color:var(--laurel-dark)}
.lang a.active{background:var(--laurel);color:#fff;border-color:var(--laurel)}

/* ====== Hero (light variant) ====== */
.hero{min-height:72vh;display:grid;place-items:center;background:linear-gradient(135deg,#fff 0%,var(--alabaster) 56%,var(--bone) 100%);position:relative;overflow:hidden}
.hero:before{content:"";position:absolute;inset:10% -8% auto auto;width:58vw;height:58vw;border-radius:50%;background:rgba(255,255,255,.45);filter:blur(1px)}
.hero-inner{position:relative;max-width:1220px;width:100%;padding:110px 24px 90px;display:grid;grid-template-columns:1.05fr .95fr;gap:58px;align-items:center}

.eyebrow{
  text-transform:uppercase;
  letter-spacing:.16em;
  font-size:11.5px;
  color:var(--laurel);
  font-weight:600;
  margin-bottom:22px;
}

.hero h1,
.page-hero h1{
  font-family:var(--font-display);
  font-size:clamp(44px,6.5vw,92px);
  line-height:.96;
  letter-spacing:-.035em;
  margin:0 0 26px;
  font-weight:600;
  color:var(--ink);
}
.hero p{font-size:20px;max-width:650px;color:var(--army-soft);margin:0 0 28px;line-height:1.55}

.hero-card{background:var(--army);color:#fff;border-radius:var(--radius);padding:46px;min-height:430px;box-shadow:var(--shadow);display:flex;flex-direction:column;justify-content:space-between}
.hero-logo{font-family:var(--font-display);font-size:clamp(64px,7.2vw,116px);font-weight:600;letter-spacing:-.025em;line-height:.86;text-transform:none}
.hero-card p{color:#dedbcf;font-size:17px}

/* ====== Buttons ====== */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  background:var(--laurel);color:#fff;
  border:1px solid var(--laurel);
  border-radius:999px;
  padding:14px 24px;
  font-size:14px;font-weight:600;letter-spacing:.02em;
  transition:background .18s ease,transform .18s ease,border-color .18s ease;
}
.btn:hover{background:var(--laurel-dark);border-color:var(--laurel-dark);transform:translateY(-1px)}
.btn.light{background:#fff;color:var(--ink);border-color:#fff}
.btn.light:hover{background:var(--alabaster);border-color:var(--alabaster)}
.btn.ghost{background:transparent;color:var(--ink);border:1px solid var(--line-strong)}
.btn.ghost:hover{background:rgba(109,130,127,.08);border-color:var(--laurel);color:var(--laurel-dark)}

/* ====== Sections ====== */
main section{padding:90px 24px}
.wrap{max-width:1220px;margin:0 auto}
.section-head{display:grid;grid-template-columns:1fr 1fr;gap:42px;margin-bottom:38px}
.section-head h2,
.page-section h2{
  font-family:var(--font-display);
  font-size:clamp(30px,4.2vw,58px);
  line-height:1;
  letter-spacing:-.03em;
  margin:0;
  font-weight:600;
  color:var(--ink);
}
.section-head p{color:var(--muted);font-size:19px;margin:0;line-height:1.55}

/* ====== Cards ====== */
.grid{display:grid;gap:22px}
.cards-4{grid-template-columns:repeat(4,1fr)}
.cards-3{grid-template-columns:repeat(3,1fr)}
.card{
  border:1px solid var(--line);
  border-radius:20px;
  padding:30px;
  background:#fff;
  min-height:235px;
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
  display:flex;flex-direction:column;justify-content:space-between;
}
.card:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:rgba(109,130,127,.30)}
.card h3{font-family:var(--font-display);font-size:22px;line-height:1.1;margin:0 0 14px;letter-spacing:-.02em;font-weight:600;color:var(--ink)}
.card p{color:var(--muted);margin:0 0 20px}

.soft{background:var(--bone)}
.statement{
  font-family:var(--font-display);
  font-size:clamp(32px,5vw,72px);
  line-height:1.02;
  letter-spacing:-.035em;
  font-weight:600;
  max-width:1120px;
  margin:0;
  color:var(--ink);
}

.split{display:grid;grid-template-columns:.9fr 1.1fr;gap:48px;align-items:start}
.split > div > .btn,
.split > div > .btn.ghost{margin-top:18px}

.feature-list{display:grid;gap:14px}
.feature{padding:24px 0;border-top:1px solid var(--line)}
.feature h3{margin:0 0 8px;font-size:20px;font-family:var(--font-display);font-weight:600;letter-spacing:-.02em;color:var(--ink)}
.feature p{margin:0;color:var(--muted)}

/* ====== Quotes ====== */
.quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.quote{background:#fff;border:1px solid var(--line);border-left:3px solid var(--laurel);border-radius:18px;padding:28px}
.quote blockquote{margin:0 0 22px;color:var(--army-soft);font-size:16px;line-height:1.6}
.quote cite{font-style:normal;font-weight:600;color:var(--laurel-dark);font-size:14px;letter-spacing:.02em}

/* ====== CTA ====== */
.cta{
  background:var(--army);color:#fff;border-radius:28px;padding:58px;
  display:grid;grid-template-columns:1.4fr .6fr;gap:30px;align-items:center;
}
.cta h2{font-family:var(--font-display);font-size:clamp(32px,4.6vw,58px);line-height:1;letter-spacing:-.035em;margin:0;font-weight:600}
.cta p{color:#cdd1cf;font-size:18px;line-height:1.55}

/* ====== Page Hero (light) ====== */
.page-hero{background:var(--alabaster);padding:95px 24px 70px}
.page-hero .wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:end}
.page-hero p{font-size:20px;color:var(--army-soft);max-width:720px;line-height:1.55}

.page-section{padding:80px 24px}

/* ====== Process (steps) ====== */
.process{counter-reset:item;display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.step{border:1px solid var(--line);padding:28px;border-radius:18px;background:#fff;transition:border-color .18s ease,box-shadow .18s ease}
.step:hover{border-color:rgba(109,130,127,.30);box-shadow:var(--shadow-soft)}
.step:before{counter-increment:item;content:counter(item,decimal-leading-zero);display:block;color:var(--laurel);font-weight:600;font-size:13px;letter-spacing:.12em;margin-bottom:18px}
.step h3{margin:0 0 8px;font-size:21px;font-family:var(--font-display);font-weight:600;letter-spacing:-.02em;color:var(--ink)}

/* ====== Contact ====== */
.contact-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.contact-box{background:#fff;border:1px solid var(--line);border-radius:18px;padding:30px}
.contact-box h3{font-family:var(--font-display);font-weight:600;letter-spacing:-.015em;color:var(--laurel-dark);margin:0 0 12px;font-size:18px}
.contact-box p{margin:0 0 6px;color:var(--army-soft)}

/* ====== Footer ====== */
.footer{border-top:1px solid var(--line);padding:44px 24px;background:#fff}
.footer-inner{max-width:1220px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:28px;color:var(--muted);font-size:13.5px}
.footer-inner strong{color:var(--ink);font-weight:600}

.whatsapp{
  position:fixed;right:20px;bottom:20px;z-index:50;
  background:#25d366;color:#fff;
  border-radius:999px;padding:13px 20px;
  font-weight:600;font-size:14px;letter-spacing:.02em;
  box-shadow:0 14px 30px rgba(37,211,102,.30);
  transition:transform .18s ease,box-shadow .18s ease;
}
.whatsapp:hover{transform:translateY(-2px);box-shadow:0 18px 36px rgba(37,211,102,.40)}

/* ====== Forms ====== */
.form{display:grid;gap:14px}
.form input,.form textarea{
  width:100%;padding:14px 16px;
  border:1px solid var(--line-strong);border-radius:14px;
  font:inherit;background:#fff;color:var(--ink);
  transition:border-color .18s ease,box-shadow .18s ease;
}
.form input:focus,.form textarea:focus{outline:none;border-color:var(--laurel);box-shadow:0 0 0 3px rgba(109,130,127,.16)}
.form textarea{min-height:150px;resize:vertical}
.note{color:var(--muted);font-size:13.5px}

/* ====== Portals ====== */
.portal-row{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.portal{border:1px solid var(--line);border-radius:16px;padding:22px;text-align:center;font-weight:600;background:#fff;color:var(--ink)}

.blog-card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:30px}

.menu-toggle{display:none}

/* ====== Team ====== */
.team-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.team-card{border:1px solid var(--line);border-radius:20px;padding:28px;background:#fff;height:340px;min-height:340px;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;display:flex;flex-direction:column;justify-content:flex-start;overflow:hidden}
.team-card:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:rgba(109,130,127,.30)}
.team-photo{width:104px;height:104px;flex:0 0 104px;border-radius:50%;background:linear-gradient(135deg,var(--alabaster),var(--bone));overflow:hidden;margin-bottom:18px}
.team-photo img{width:100%;height:100%;object-fit:cover;display:block}
.team-initials{width:100%;height:100%;display:grid;place-items:center;font-size:30px;font-weight:600;letter-spacing:-.02em;color:#fff;background:var(--laurel)}
.team-body{padding:0;display:flex;flex-direction:column;gap:7px;min-height:0;flex:1}
.team-body h3{font-family:var(--font-display);font-size:16px;line-height:1.15;margin:0;letter-spacing:.02em;text-transform:uppercase;font-weight:600;color:var(--ink)}
.team-role{font-size:11px;font-weight:600;letter-spacing:.10em;text-transform:uppercase;color:var(--laurel-dark);margin:0}
.team-body p:not(.team-role){color:var(--muted);margin:0;font-size:13px;line-height:1.45;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}

/* ====== Responsive ====== */
@media(max-width:920px){
  .team-grid{grid-template-columns:1fr 1fr}
  .team-card{height:330px;min-height:330px}
  .hero-inner,.page-hero .wrap,.section-head,.split,.cta,.footer-inner{grid-template-columns:1fr}
  .cards-4,.cards-3,.quotes,.process,.contact-grid,.portal-row{grid-template-columns:1fr 1fr}
  .hero-card{min-height:320px}
  .nav{align-items:flex-start}
  .nav-links{display:none;position:absolute;left:0;right:0;top:78px;background:#fff;border-bottom:1px solid var(--line);padding:18px 24px;flex-direction:column;align-items:flex-start;gap:14px}
  .nav-links.open{display:flex}
  .menu-toggle{display:block;border:1px solid var(--line-strong);background:#fff;border-radius:999px;padding:10px 16px;font-weight:600}
}
@media(max-width:640px){
  body{font-size:15.5px}
  .team-grid{grid-template-columns:1fr}
  .team-card{height:auto;min-height:300px}
  .hero h1,.page-hero h1{font-size:46px}
  .cards-4,.cards-3,.quotes,.process,.contact-grid,.portal-row{grid-template-columns:1fr}
  .nav{padding:16px}
  .wordmark{font-size:26px}
  .hero-inner{padding:70px 18px}
  .hero-logo{font-size:64px}
  .cta{padding:34px}
  .footer-inner{font-size:13px}
  .whatsapp{left:18px;right:18px;text-align:center}
  .lang{flex-wrap:wrap}
}

/* ====== Comprar Hero (sopra immagine) ====== */
.comprar-hero{
  position:relative;overflow:hidden;
  background:linear-gradient(90deg,rgba(245,242,240,.94),rgba(245,242,240,.72)),url('/assets/img/comprar.jpg') center/cover no-repeat;
}
.comprar-hero:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.18),rgba(245,242,240,.36));pointer-events:none}
.comprar-hero .wrap{position:relative;z-index:1}
.comprar-hero h1,.comprar-hero p{text-shadow:0 1px 18px rgba(245,242,240,.7)}