:root { --ink:#1b1b26; --paper:#fbfaf8; --teal:#00838f; --magenta:#b81d5b; --cyan:#00a9d6; --muted:#666672; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:Arial, Helvetica, sans-serif; }
a { color:inherit; text-decoration:none; }
.shell { width:min(1180px, calc(100% - 40px)); margin-inline:auto; }
.hero { min-height:610px; margin-top:28px; border-radius:34px; overflow:hidden; background:var(--ink); color:white; display:grid; grid-template-columns:49% 51%; position:relative; box-shadow:0 25px 70px rgba(27,27,38,.18); }
.hero-copy { padding:58px 24px 52px 62px; z-index:2; align-self:center; }
.logo { object-fit:contain; }
.logo-white { width:235px; height:90px; object-position:left center; margin-bottom:44px; }
.eyebrow,.tag { display:block; font-size:12px; font-weight:800; letter-spacing:.17em; }
.eyebrow { color:#64d1d7; margin-bottom:18px; }
h1,h2,h3,p { margin-top:0; }
h1,h2,h3 { font-weight:700; }
h1 { font-family:Georgia, serif; font-size:clamp(42px,5vw,70px); line-height:1.03; max-width:570px; margin-bottom:24px; }
.hero-text { max-width:510px; color:#dedee5; font-size:18px; line-height:1.6; }
.hero-photo { background:linear-gradient(90deg,var(--ink) 0%,transparent 25%),url('assets/ariane-hero.jpeg') center/cover no-repeat; min-height:610px; }
.socials { display:flex; gap:12px; margin-top:28px; }
.socials a { width:40px; height:40px; border:1px solid rgba(255,255,255,.35); display:grid; place-items:center; border-radius:50%; font-weight:800; transition:.2s; }
.socials a:hover { background:var(--magenta); border-color:var(--magenta); transform:translateY(-2px); }
.line-art { position:absolute; width:145px; height:145px; border:2px solid var(--cyan); transform:rotate(38deg); opacity:.65; right:-55px; top:-45px; }
.line-art.two { border-color:var(--magenta); width:95px; height:95px; right:65px; top:-65px; }
.content { padding-block:75px 90px; display:flex; flex-direction:column; gap:84px; }
.section-heading { display:flex; align-items:baseline; justify-content:center; gap:8px; margin-bottom:30px; }
.section-heading span { color:var(--magenta); font-family:Georgia,serif; font-size:29px; font-weight:700; }
.section-heading h2 { font-family:Georgia,serif; font-weight:700; font-size:29px; margin:0; }
.priority-grid { display:grid; grid-template-columns:1.18fr .82fr; gap:20px; }
.feature { min-height:285px; padding:32px 78px; border-radius:25px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; overflow:hidden; position:relative; text-align:center; box-shadow:0 13px 35px rgba(27,27,38,.1); transition:.25s; }
.feature:hover,.small-card:hover,.brand-grid a:hover { transform:translateY(-4px); box-shadow:0 18px 40px rgba(27,27,38,.15); }
.feature.aula { background:linear-gradient(135deg,#fff,#fff8fa); border:1px solid #f1d6e1; }
.feature.mentoria { color:white; background:linear-gradient(135deg,#111827,#004d59 72%,#006b77); }
.feature .tag { opacity:.82; margin-bottom:11px; }
.feature h3 { font-family:Georgia,serif; font-weight:700; font-size:31px; margin-bottom:10px; text-align:center; }
.feature p { line-height:1.5; margin:0; opacity:.84; text-align:center; }
.feature .button { margin-top:18px; }
.button { width:max-content; min-height:48px; display:inline-flex; align-items:center; justify-content:center; text-align:center; gap:20px; padding:0 20px; border-radius:11px; font-weight:800; font-size:13px; text-transform:uppercase; letter-spacing:.04em; transition:transform .2s, box-shadow .2s, filter .2s; }
.button:hover { transform:translateY(-2px); box-shadow:0 8px 18px rgba(27,27,38,.18); filter:brightness(1.04); }
.button.white { background:white; color:var(--magenta); }
.button.outline { border:1px solid var(--teal); color:var(--teal); }
.button.solid { background:var(--teal); color:white; }
.button.primary { color:white; background:linear-gradient(90deg,var(--magenta),#e91e63); }
.button.outline-magenta { color:var(--magenta); border:1px solid var(--magenta); }
.whatsapp { margin-top:18px; min-height:78px; padding:0 64px; border-radius:18px; color:white; background:linear-gradient(90deg,#078f82,#00838f); display:flex; align-items:center; justify-content:center; position:relative; transition:transform .2s, box-shadow .2s, filter .2s; }
.whatsapp-icon { width:34px; height:34px; flex:0 0 auto; margin-right:13px; }
.whatsapp-icon circle,.whatsapp-icon path { fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.whatsapp-label { font-family:Georgia,serif; font-size:26px; font-weight:700; text-align:center; }
.whatsapp:hover { filter:brightness(1.08); transform:translateY(-2px); box-shadow:0 10px 24px rgba(0,131,143,.24); }
.link-grid { display:grid; gap:18px; }
.link-grid.three { grid-template-columns:repeat(3,1fr); }
.small-card { min-height:160px; background:white; border:1px solid #e4e4e8; border-radius:18px; padding:24px 28px; display:flex; flex-direction:column; gap:14px; align-items:center; justify-content:center; text-align:center; position:relative; box-shadow:0 8px 24px rgba(27,27,38,.07); transition:transform .25s, box-shadow .25s, border-color .25s, background .25s; }
.small-card i,.tool-list i { font-style:normal; font-size:34px; color:var(--teal); line-height:1; }
.small-card i.globe { font-size:38px; }
.small-card i.youtube { width:42px; height:29px; border-radius:7px; display:grid; place-items:center; background:#e00024; color:white; font-size:16px; padding-left:2px; }
.small-card i.linkedin { background:#0877a8; color:white; width:34px; height:34px; display:grid; place-items:center; border-radius:4px; font-size:20px; font-weight:bold; }
.small-card > span,.tool-list a > span { display:flex; flex-direction:column; align-items:center; gap:8px; text-align:center; }
.small-card b,.tool-list b { font-size:18px; line-height:1.25; }
.small-card small,.tool-list small { font-size:15px; line-height:1.35; }
.small-card:hover { background:#f8fdfd; border-color:rgba(0,131,143,.45); }
.small-card small,.tool-list small { color:var(--muted); }
.tools { background:white; border:1px solid #e6e6e9; border-radius:28px; padding:42px; box-shadow:0 12px 35px rgba(27,27,38,.07); }
.intro { color:var(--muted); line-height:1.55; text-align:center; max-width:760px; margin:-15px auto 30px; }
.tool-list { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid #e6e6e9; }
.tool-list a { min-height:160px; padding:24px 28px; display:flex; flex-direction:column; gap:14px; align-items:center; justify-content:center; text-align:center; position:relative; border-right:1px solid #e6e6e9; transition:background .2s, color .2s, transform .2s; }
.tool-list a:last-child { border:0; }
.tool-list a:hover { background:#f2fbfb; color:var(--teal); }
.book-card { background:white; border:1px solid #eeeeef; border-radius:28px; padding:34px 64px; display:grid; grid-template-columns:350px 1fr; align-items:center; gap:60px; box-shadow:0 16px 45px rgba(27,27,38,.09); overflow:hidden; }
.book-image { height:380px; padding:0 24px; display:grid; place-items:center; position:relative; z-index:1; perspective:900px; }
.book-image img { display:block; width:auto; height:340px; max-width:100%; object-fit:contain; transform:rotateY(-4deg); transform-origin:left center; border-left:5px solid rgba(220,225,226,.9); box-shadow:-10px 14px 24px rgba(27,27,38,.22); }
.tag.teal { color:var(--teal); margin-bottom:38px; position:relative; }
.tag.teal::after { content:""; position:absolute; width:82px; height:4px; border-radius:4px; background:var(--magenta); left:50%; transform:translateX(-50%); bottom:-20px; }
.book-copy { text-align:center; display:flex; flex-direction:column; align-items:center; position:relative; z-index:2; }
.book-copy h2 { font-family:Georgia,serif; font-size:clamp(34px,3.4vw,52px); line-height:1.1; font-weight:700; width:100%; margin-bottom:34px; }
.book-copy h2 span { display:block; }
.button.amazon { justify-content:center; font-weight:900; min-width:340px; min-height:66px; font-size:16px; border-radius:10px; }
.centered { margin-bottom:15px; }
.centered-text { margin-top:0; }
.brand-grid { display:grid; grid-template-columns:1fr 1fr; gap:22px; }
.brand-grid a { background:white; border:1px solid #e5e5e8; border-radius:22px; min-height:210px; padding:28px; display:flex; flex-direction:column; justify-content:center; align-items:center; box-shadow:0 8px 25px rgba(27,27,38,.07); transition:.25s; overflow:hidden; }
.brand-grid img { object-fit:contain; object-position:center; display:block; }
.brand-grid img.brand-cris { width:35%; height:auto; max-height:95px; }
.brand-grid img.brand-classic { width:30%; height:auto; max-height:123px; }
footer { background:var(--ink); color:white; padding:30px 0; }
.footer-inner { display:flex; align-items:center; justify-content:space-between; gap:20px; }
.footer-inner img { width:180px; height:65px; object-fit:contain; }
.footer-inner .socials { margin:0; }

@media (max-width: 800px) {
  .shell { width:min(100% - 24px, 620px); }
  .hero { min-height:720px; margin-top:12px; grid-template-columns:1fr; grid-template-rows:1fr 45%; }
  .hero-copy { padding:34px 28px 15px; align-self:start; }
  .logo-white { width:160px; height:62px; margin-bottom:18px; }
  .eyebrow { font-size:10px; margin-bottom:12px; }
  h1 { font-size:39px; max-width:440px; margin-bottom:16px; }
  .hero-text { font-size:16px; line-height:1.45; }
  .hero-photo { grid-row:2; min-height:330px; background:linear-gradient(180deg,var(--ink) 0%,transparent 22%),url('assets/ariane-hero.jpeg') center 24%/cover no-repeat; }
  .socials { margin-top:17px; }
  .socials a { width:35px; height:35px; }
  .content { padding-block:52px 65px; gap:62px; }
  .section-heading { width:100%; gap:6px; flex-wrap:wrap; justify-content:center; text-align:center; margin-bottom:22px; }
  .section-heading span,.section-heading h2 { font-size:24px; }
  .priority-grid,.link-grid.three,.tool-list { grid-template-columns:1fr; }
  .feature { min-height:245px; padding:28px 68px; }
  .feature > div { text-align:center; }
  .feature h3 { font-size:27px; text-align:center; }
  .feature p { text-align:center; }
  .feature .button { justify-content:center; text-align:center; }
  .whatsapp { min-height:70px; padding-inline:24px; }
  .whatsapp-icon { width:30px; height:30px; margin-right:10px; }
  .whatsapp-label { font-size:22px; }
  .small-card { min-height:145px; padding:22px 24px; gap:12px; }
  .small-card b,.tool-list b { font-size:17px; }
  .small-card small,.tool-list small { font-size:14px; }
  .tools { padding:28px 19px; }
  .tool-list a { min-height:145px; border-right:0; border-bottom:1px solid #e6e6e9; padding:22px 24px; gap:12px; }
  .tool-list a:last-child { border-bottom:0; }
  .book-card { padding:28px 22px; grid-template-columns:145px 1fr; gap:25px; align-items:center; }
  .book-image { height:215px; padding:0 12px; }
  .book-image img { height:180px; }
  .tag.teal { margin-bottom:30px; }
  .book-copy h2 { font-size:27px; margin-bottom:25px; }
  .button.amazon { min-width:240px; min-height:54px; font-size:13px; }
  .button { font-size:11px; min-height:44px; padding-inline:15px; }
  .brand-grid { gap:12px; }
  .brand-grid a { min-height:165px; padding:16px; }
  .brand-grid img.brand-cris { width:50%; height:auto; max-height:74px; }
  .brand-grid img.brand-classic { width:43%; height:auto; max-height:88px; }
  .footer-inner { flex-direction:column; }
  .footer-inner > span { font-family:Georgia,serif; }
}

@media (max-width: 450px) {
  .hero { min-height:690px; }
  h1 { font-size:34px; }
  .feature { padding:26px 24px; }
  .whatsapp-label { font-size:20px; }
  .book-card { grid-template-columns:1fr; grid-template-rows:270px auto; gap:28px; padding:28px 20px 32px; text-align:center; }
  .book-image { height:270px; padding:0 24px; }
  .book-image img { height:230px; max-height:230px; }
  .book-copy .button { margin-inline:auto; }
  .button.amazon { min-width:250px; }
  .small-card:active,.tool-list a:active,.whatsapp:active,.button:active { transform:scale(.985); }
}