:root { --paper:#f7f3e8;--ink:#213d1f;--green:#213d1f;--clay:#996043;--gold:#eab864;--sage:#e5e8dd;--pale:#eeebdd;--line:#c4c9b9 }
* { box-sizing:border-box }
html { scroll-behavior:smooth;scroll-padding-top:28px }
body { margin:0;background:var(--paper);color:var(--ink);font:17px/1.75 'Segoe UI',Arial,sans-serif }
p { margin:0 0 24px;text-wrap:pretty }
h1, h2, h3 { font-family:Georgia,serif;font-weight:400;line-height:1.12;letter-spacing:-.035em;margin:0 0 28px;text-wrap:balance }
h1 { font-size:clamp(44px,4.3vw,66px) }
h2 { font-size:clamp(36px,3.8vw,56px) }
h3 { font-size:28px }
a { color:inherit;text-underline-offset:5px }
header, footer { display:flex;justify-content:space-between;align-items:center;gap:32px;padding:24px 5vw }
.brand { display:block;width:320px;flex-shrink:0;text-decoration:none }
.brand img { display:block;width:100%;height:auto }
.brand span { display:block;font:11px/1.5 'Segoe UI',sans-serif;letter-spacing:.1em;text-align:right;padding-right:10px;margin-top:4px }
nav { display:flex;align-items:center;gap:28px;font-size:14px }
nav>a { text-decoration:none }
.button { display:inline-flex;align-items:center;justify-content:center;gap:24px;padding:15px 25px;border:1px solid transparent;border-radius:6px;background:var(--green);color:var(--paper);font-size:14px;font-weight:600;text-decoration:none }
.button:hover { background:#35552e }
.button span { font-size:18px }
.label { font-size:12px;letter-spacing:.07em;font-weight:600;margin-bottom:24px }
.hero { display:grid;grid-template-columns:1fr 1fr;min-height:680px;border-top:1px solid var(--line) }
.hero-copy { text-align:center;align-self:center;padding:56px 3vw }
.hero-copy>.label { color:var(--clay) }
.hero h1 { max-width:590px;margin-inline:auto }
.care { display:grid;grid-template-columns:1fr 1.1fr;align-items:center;background:var(--sage);gap:64px;padding:88px 7vw }
.care-copy>p { max-width:450px }
.care ul { padding:0;list-style:none }
.care li { padding:12px 0;border-bottom:1px solid #bcc5b3;font-size:15px }
.care li:before { content:'✓';margin-right:14px;color:var(--clay) }
.care img { width:100%;height:auto;display:block;border-radius:3px }
.approach { display:grid;grid-template-columns:1.1fr 1fr;gap:80px;padding:96px 8vw;background:var(--green);color:var(--paper) }
.approach .label { color:var(--gold) }
.approach h2 { font-size:48px }
.themes { padding:96px 6vw;text-align:center }
.theme-grid { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px;align-items:start;margin-top:44px }
.theme-grid article { min-width:0 }
.topic-art { position:relative;width:100%;aspect-ratio:1;overflow:hidden;mix-blend-mode:multiply }
.topic-art img { position:absolute;top:-18%;left:0;width:400%;max-width:none;height:auto;display:block }
.topic-art-1 img { left:-100% }
.topic-art-2 img { left:-200% }
.topic-art-3 img { left:-300% }
.theme-grid h3 { font-size:clamp(22px,2vw,28px);margin:16px 0;letter-spacing:-.025em }
.theme-grid p { font-size:15px;line-height:1.7;max-width:29ch;margin-inline:auto }
.about { display:grid;grid-template-columns:.85fr 1.1fr;gap:88px;align-items:center;padding:96px 9vw;background:var(--pale) }
.about h2 { font-size:60px }
.about p:not(.label) { font-size:16px }
.getting-started { display:grid;grid-template-columns:1fr 1fr;gap:90px;padding:96px 8vw }
.getting-started ol { margin:0;padding-left:28px }
.getting-started li { padding:0 0 24px 14px }
.getting-started li::marker { color:var(--clay);font:26px Georgia,serif }
.getting-started h3 { font-size:28px;margin-bottom:12px }
.getting-started li p { font-size:15px;margin:0 }
.faq { padding:80px 8vw 96px;display:grid;grid-template-columns:.8fr 1.2fr;gap:80px;border-top:1px solid var(--line) }
.questions { border-top:1px solid var(--line) }
details { border-bottom:1px solid var(--line) }
summary { list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:24px 0;font-size:16px }
summary::-webkit-details-marker { display:none }
summary span { font-size:24px;color:var(--clay) }
details[open] summary span { transform:rotate(45deg) }
details p { font-size:15px }
.closing { text-align:center;background:var(--paper);padding:64px 24px 88px;border-top:7px solid var(--gold) }
.closing h2 { font-size:clamp(40px,4.7vw,68px) }
footer { padding-block:44px;border-top:1px solid var(--line);flex-wrap:wrap }
footer>div { font-size:13px }
.social-action { display:inline-flex;align-items:center;justify-content:flex-start;gap:14px;width:218px;min-height:76px;padding:16px 18px;border:1px solid var(--line);border-radius:6px;background:var(--paper);color:var(--ink);font-family:inherit;text-decoration:none;text-align:left;cursor:pointer;transition:background .18s ease,border-color .18s ease }
.social-action svg { width:26px;height:26px;flex:0 0 26px }
.social-copy { display:flex;flex-direction:column;gap:3px;line-height:1.4 }
.social-copy strong { font-size:14px;font-weight:600 }
.social-copy small { font-size:12px;color:#52604f }
.contact-arrow { margin-left:auto;font-size:17px }
.social-action:hover { background:#eeebdd;border-color:var(--green) }
.contact-links { display:flex;justify-content:center;align-items:stretch;gap:12px;flex-wrap:wrap }
.whatsapp-slot { display:flex;align-items:stretch }
.closing .whatsapp-action { border-color:var(--green);background:var(--green);color:var(--paper) }
.closing .whatsapp-action small { color:var(--paper) }
.closing .whatsapp-action:hover { background:#35552e }
.skip { position:absolute;top:-100px;padding:16px;background:var(--paper);z-index:10 }
.skip:focus { top:0 }
:focus-visible { outline:3px solid var(--clay);outline-offset:5px }
.approach :focus-visible { outline-color:var(--gold) }
dialog { max-width:600px;width:calc(100% - 32px);padding:32px;background:var(--paper);color:var(--ink);border:1px solid var(--line) }
dialog::backdrop { background:#213d1f80 }
.privacy-head { display:flex;justify-content:space-between;gap:24px }
.privacy-head h2 { font-size:32px }
.privacy-head button { font-size:32px;border:0;background:none;color:inherit;cursor:pointer }
dialog p { font-size:14px }
@media(min-width:1600px) {
  main { max-width:1800px;margin:auto }
}
@media(max-width:1100px) {
  header .brand { width:270px }
  nav { gap:20px }
  nav>a:not(.button) { display:none }
  .hero-copy { padding:44px 3vw }
  .hero h1 { font-size:45px }
  .care, .approach, .about, .faq, .getting-started { gap:40px;padding:64px 6vw }
  .theme-grid { grid-template-columns:repeat(2,minmax(0,1fr));gap:40px 32px }
  .topic-art { max-width:250px;margin-inline:auto }
  .theme-grid h3 { font-size:28px }
  .approach h2 { font-size:40px }
  .about h2 { font-size:48px }
}
@media(max-width:600px) {
  body { font-size:16px }
  header { padding:18px 20px;gap:14px;flex-wrap:wrap }
  header .brand { width:255px;max-width:100% }
  header nav { width:100%;justify-content:flex-end }
  .hero { display:flex;flex-direction:column-reverse }
  .hero-copy { padding:42px 24px }
  .hero h1 { font-size:41px }
  .label { font-size:11px;margin-bottom:22px }
  .care, .approach, .about, .faq, .getting-started { grid-template-columns:1fr;padding:60px 24px;gap:32px }
  .care h2, .approach h2 { font-size:37px }
  .themes { padding:60px 24px }
  .themes h2 { font-size:36px }
  .theme-grid { grid-template-columns:1fr;gap:36px;margin-top:28px }
  .topic-art { max-width:215px }
  .theme-grid h3 { font-size:29px;margin-top:0 }
  .theme-grid p { max-width:34ch }
  .about { padding-inline:32px }
  .about h2 { font-size:46px }
  .faq h2 { font-size:40px }
  .closing { padding:48px 24px 64px }
  .closing h2 { font-size:40px }
  footer { padding:36px 24px;gap:28px }
  .contact-links { flex-direction:column;align-items:stretch;gap:12px;width:100%;max-width:330px;margin-inline:auto }
  .contact-links .social-action { width:100% }
  .whatsapp-slot { width:100% }
  .social-action { min-height:72px }
  .getting-started h2 { font-size:36px }
}
@media(prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto }
  .social-action { transition:none }
}
.about { display:block;padding:80px 8vw }
.about>div { max-width:860px;margin-inline:auto }
.about h2 { font-size:clamp(42px,4.4vw,60px) }
.about p:not(.label) { max-width:70ch }
@media(max-width:600px) {
  .about { padding:56px 24px }
}
header { padding-block:18px }
.brand { width:285px }
.brand span { font-size:10px;margin-top:0 }
nav a:last-child { color:var(--clay) }
.hero { display:block;position:relative;isolation:isolate;overflow:hidden;min-height:650px;background:var(--paper);border-top:1px solid var(--line) }
.hero-scene { position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:right bottom;z-index:-1;pointer-events:none }
.hero-copy { position:relative;text-align:left;width:57%;max-width:760px;padding:95px 0 100px 7vw;align-self:auto }
.hero-copy>.label { color:var(--clay) }
.hero h1 { font-size:clamp(44px,4.4vw,68px);max-width:650px;margin:0 0 30px;line-height:1.12 }
.hero-copy>p:not(.label) { max-width:400px;margin:0 0 32px;font-size:18px }
.hero .button { margin:0 }
.care { position:relative;background:var(--paper);padding:72px 8vw 88px;gap:36px;grid-template-columns:1fr 1.1fr;border-top:1px solid var(--line) }
.care-copy { max-width:470px }
.care h2 { font-size:48px }
.care-objects { display:block;width:100%;height:auto;max-width:650px }
.care ul { margin-bottom:0 }
.care li { font-size:16px }
.approach { align-items:center;padding-block:72px }
.approach p:last-child { margin-bottom:0 }
.approach h2 { margin-bottom:0 }
.themes { padding-block:80px }
.getting-started { padding-block:72px }
.getting-started h2 { font-size:46px }
.faq { padding-block:64px }
.closing { padding:64px 24px;border-top:1px solid var(--line) }
.closing h2 { font-size:54px;margin-bottom:20px }
footer { padding:25px 6vw;font-size:12px }
footer span, footer a { font-size:12px }
.about p:first-of-type { font-size:13px;color:var(--clay) }
@media(max-width:1100px) {
  header .brand { width:260px }
  nav>a:not(.button) { display:block }
  nav { gap:20px }
  .hero { min-height:610px }
  .hero-copy { padding-top:85px;padding-bottom:85px;width:59% }
  .hero h1 { font-size:48px }
  .hero-scene { width:110%;left:auto;right:-5% }
  .care h2 { font-size:42px }
}
@media(max-width:700px) {
  header { padding:16px 24px;gap:18px }
  header .brand { width:245px }
  header nav { width:100%;justify-content:space-between;font-size:13px;gap:15px }
  .hero { min-height:980px }
  .hero-copy { width:100%;max-width:none;padding:46px 24px 520px }
  .hero h1 { font-size:42px;max-width:540px;margin-bottom:24px }
  .hero-copy>p:not(.label) { font-size:17px;max-width:330px;margin-bottom:24px }
  .hero-scene { width:750px;max-width:none;height:500px;top:auto;bottom:0;right:0;left:auto;object-fit:contain }
  .care { padding:56px 24px;grid-template-columns:1fr;gap:28px }
  .care h2 { font-size:38px }
  .care-objects { max-width:470px;margin:auto }
  .approach { padding-block:56px }
  .getting-started h2 { font-size:38px }
  .closing h2 { font-size:42px }
  .about { padding-block:56px }
  .faq { padding-block:56px }
  footer { gap:12px;padding:24px }
  .closing { padding-block:52px }
}
@media(max-width:380px) {
  .hero h1 { font-size:37px }
  .hero-copy { padding-bottom:480px }
  .hero { min-height:920px }
  .hero-scene { width:690px;height:460px }
}
.hero-scene { width:auto;aspect-ratio:3/2;left:auto;right:0;transform:translateX(37%) scaleX(-1) }
[hidden] { display:none!important }
.footer-links { display:flex;gap:20px;flex-wrap:wrap }
.footer-links button { border:0;background:none;color:inherit;font:inherit;padding:0;text-decoration:underline;text-underline-offset:5px;cursor:pointer }
.cookie-banner { position:fixed;z-index:30;bottom:16px;left:16px;right:16px;max-width:980px;margin:auto;padding:20px 24px;background:var(--paper);border:1px solid var(--line);border-radius:8px;box-shadow:0 6px 30px #213d1f26;display:flex;gap:24px;align-items:center;font-size:14px;line-height:1.5 }
.cookie-banner p { margin:6px 0 0 }
.cookie-actions { display:flex;gap:10px;flex-shrink:0 }
.cookie-actions button { padding:12px 16px;min-height:44px;border:1px solid var(--green);border-radius:5px;background:var(--paper);color:var(--green);font:600 14px 'Segoe UI',sans-serif;cursor:pointer }
.cookie-actions button[data-consent="granted"] { background:var(--green);color:var(--paper) }
:focus-visible { outline:3px solid var(--clay);outline-offset:4px }
@media(max-width:700px) {
  .cookie-banner { flex-direction:column;align-items:stretch;gap:16px;padding:18px;max-height:70vh;overflow:auto }
  .cookie-actions { flex-wrap:wrap }
  .cookie-actions button { flex:1 }
  footer { flex-wrap:wrap }
  .footer-links { gap:16px;font-size:13px }
}
.hero-copy > p:not(.label):not(.fine) { max-width:400px; margin:0 0 32px; } @media(max-width:700px) { .hero-copy > p:not(.label):not(.fine) { max-width:330px; margin:0 0 24px; } }
.closing > p:not(.label):not(.fine) { max-width:530px; margin:0 auto 28px; }