﻿/* Editorial direction: restrained typography, warm paper, deliberate spacing. */
:root {
  --gold: #bd873e;
  --gold-light: #ebbc78;
  --paper: #faf8f4;
  --ink: #162d40;
  --ease-out: cubic-bezier(.22,1,.36,1);
  --display: 'Iowan Old Style', 'Palatino Linotype', 'Book Antiqua', Georgia, serif;
}
body { background: var(--paper); color: var(--ink); -webkit-font-smoothing: antialiased; }
h2 { font-family: var(--display); font-weight: 400; letter-spacing: -.045em; line-height: 1.12; font-size: clamp(2.1rem,3.9vw,3.6rem); }
h3 { letter-spacing: -.025em; }
p { line-height: 1.85; }
.section { padding-block: 100px; }
.eyebrow { font-size: 10px; letter-spacing: 1.8px; margin-bottom: 26px; }
.btn { border-radius: 2px; min-height: 52px; padding: 15px 24px; font-size: 12px; transition: background .25s, color .25s, border-color .25s, transform .4s var(--ease-out), box-shadow .4s; }
.btn-primary { background: #e8b46b; }
.btn-primary:hover { background: #f3c88f; box-shadow: 0 5px 18px #0000000b; transform: translateY(-2px); }
.btn-secondary { border-color: #b9bdbb; }
.btn-secondary:hover { background: #eeeae2; border-color: #9d9382; }
.btn span, .hero-secondary span, .product-bottom a span, .service-card h3 span { display: inline-block; transition: transform .4s var(--ease-out); }
a:hover>span:last-child:not(.badge):not(.hero-line), .btn:hover span, .service-card:hover h3 span { transform: translate(3px,-3px); }
.text-link { position: relative; border-bottom-color: #c9b99d; padding-block: 4px; transition: color .25s; }
.text-link::after { content: ''; position: absolute; bottom: -1px; left: 0; width: 100%; height: 1px; background: #916127; transform: scaleX(0); transform-origin: left; transition: transform .4s var(--ease-out); }
.text-link:hover::after { transform: scaleX(1); }
.header { position: sticky; top: 0; transition: box-shadow .3s, background .3s; }
.header.scrolled { box-shadow: 0 8px 30px #03172b12; background: #03172bf5; }
.header-inner { min-height: 86px; }
.brand { font-size: 26px; letter-spacing: -1.3px; font-weight: 500; }
.brand strong { font-weight: 600; color: #e8b46b; }
.brand small { font-size: 8px; letter-spacing: .55px; }
.brand-arrow { font-size: 29px; }
nav>a:not(.btn)::before { content: ''; position: absolute; bottom: -8px; left: 0; right: 0; height: 1px; background: var(--gold-light); transform: scaleX(0); transform-origin: left; transition: transform .3s var(--ease-out); }
nav>a:hover::before { transform: scaleX(1); }
.header-cta { min-height: 40px; font-size: 10px; padding: 11px 16px; }
.header-socials { font-size: 17px; gap: 10px; }
.reading-progress { position: fixed; inset: 0 0 auto; height: 2px; background: var(--gold-light); transform: scaleX(var(--scroll-progress,0)); transform-origin: left; z-index: 50; pointer-events: none; }
.hero { background: #03172b; }
.hero-grid { grid-template-columns: 1.15fr 1fr; min-height: 690px; gap: 45px; }
.hero-copy { padding-block: 70px 48px; }
.hero .eyebrow { font-size: 9px; letter-spacing: 1.5px; color: #b4c0cb; }
.hero h1 { font-family: var(--display); font-size: clamp(3.7rem,6.6vw,6.25rem); font-weight: 400; line-height: 1.01; letter-spacing: -.045em; margin-bottom: 30px; }
.hero-line { display: block; }
.hero-line-accent { color: #e6b879; font-style: italic; }
.hero-copy>p { font-size: 15px; max-width: 450px; color: #aebecb; line-height: 1.85; }
.hero .actions { gap: 22px; }
.hero-secondary { font-size: 11px; color: #d1d9df; border-bottom-color: #5a6b78; }
.hero-benefits { padding-top: 40px; margin-top: 38px; border-top: 1px solid #ffffff15; gap: 30px; }
.hero-benefits>span { font-size: 10px; color: #b8c7d0; }
.hero-benefits b { font-size: 24px; color: #bc915b; }
.hero-visual { padding: 45px 25px 65px 0; }
.portrait { background: #113149; border: 0; min-height: 480px; isolation: isolate; }
.hero .portrait { width: 100%; height: 525px; transform: none; border-radius: 0; background: #113149; }
.portrait::before { inset: 22px; width: auto; height: auto; border: 1px solid #e6b87925; border-radius: 0; transform: none; }
.portrait::after { width: 220%; height: 170px; background: #224258; transform: rotate(-42deg); right: -75%; top: 60px; z-index: -1; }
.portrait-edition { position: absolute; left: 44px; top: 45px; color: #b9c6cf; font-size: 8px; letter-spacing: 1.6px; }
.portrait-monogram { font-family: var(--display); font-size: clamp(160px,19vw,260px); color: #d6b382; font-weight: 400; font-style: italic; letter-spacing: -15px; line-height: 1; margin-top: -35px; }
.portrait-caption { left: 44px; bottom: 80px; font-family: var(--display); letter-spacing: 0; font-size: 21px; line-height: 1.35; color: #dce2e5; }
.portrait-note { left: 44px; bottom: 45px; font-size: 8px; color: #a6b8c7; letter-spacing: .5px; }
.hero-quote { right: 0; top: auto; bottom: 40px; background: #e8dfd0; color: #1b3549; padding: 22px 28px; font-size: 27px; line-height: 1.1; transform: none; }
.hero-quote>span { display: block; font: 8px/1.5 'Segoe UI',Arial,sans-serif; letter-spacing: 1px; text-transform: uppercase; margin-bottom: 10px; }
.hero-quote em { color: #1b3549; font-style: italic; }
.vertical-label { right: 0; bottom: auto; top: 100px; font-size: 8px; letter-spacing: 2px; }
.hero-bottom { padding-block: 22px; font-size: 9px; color: #a8b8c6; }
.intro .section-heading { display: grid; grid-template-columns: 1.35fr 1fr; gap: 0 80px; max-width: none; align-items: end; margin-bottom: 60px; }
.intro .eyebrow { grid-column: 1/-1; }
.intro h2 { margin: 0; font-size: clamp(2.4rem,4.6vw,4.1rem); }
.intro h2 em { color: #8c6637; font-style: italic; }
.intro .section-heading>p { font-size: 15px; margin-bottom: 5px; }
.pillars { gap: 50px; }
.pillars article { padding-top: 26px; border-top-color: #d8d2c7; }
.pillars article>span { font-family: var(--display); font-size: 26px; color: #a27c4c; margin-bottom: 24px; }
.pillars h3 { font-size: 18px; font-weight: 600; }
.pillars p { max-width: 320px; }
.channel { background: #eeeae2; }
.channel-grid { grid-template-columns: 1.05fr 1fr; gap: 75px; }
.video-feature { background: #08253b; aspect-ratio: 1.3; padding: 44px; border: 9px solid #fff9; box-shadow: 0 12px 30px #03172b08; }
.video-feature>strong { font-family: var(--display); font-weight: 400; font-size: clamp(38px,4.7vw,64px); line-height: 1.04; letter-spacing: -2px; }
.video-feature>strong em { font-style: italic; color: #e8b879; }
.video-feature::after { content: ''; width: 150px; height: 150%; top: -20px; right: -50px; background: #ffffff04; transform: rotate(25deg); transition: transform .8s var(--ease-out); }
.video-feature:hover::after { transform: rotate(25deg) translateX(-20px); }
.play { height: 64px; width: 64px; background: #e8b46b; color: #062440; border: 0; transition: transform .4s var(--ease-out), background .3s; }
.video-feature:hover .play { transform: scale(1.09); background: #f3c88f; }
.video-feature>small { font-size: 9px; }
.channel-features { border-top-color: #d6d0c6; margin-top: 36px; }
.channel-features b { font-weight: 400; color: #987348; }
.products { background: #faf8f4; color: var(--ink); border-top: 1px solid #e5dfd5; }
.products .eyebrow { color: #946018; }
.products .section-top p { color: var(--gray-500); max-width: 510px; }
.products .text-link { color: var(--ink); }
.product-grid { gap: 28px; }
.product-card { background: transparent; border: 0; border-radius: 0; overflow: visible; box-shadow: none; }
.product-card:hover { transform: none; }
.product-art { background: #e7e2d8; aspect-ratio: .96; border-radius: 2px; }
.product-art>.badge { background: transparent; top: 16px; left: 17px; padding: 0; font-size: 8px; color: #52606a; text-transform: uppercase; letter-spacing: 1.3px; }
.book { width: 62%; height: 73%; transform: rotate(-6deg); padding: 22px 17px; box-shadow: 10px 16px 19px #03172b18; border: 0; border-left: 3px solid #ffffff12; transition: transform .7s var(--ease-out), box-shadow .7s var(--ease-out); }
.book strong { font-family: var(--display); font-weight: 400; font-size: clamp(17px,1.9vw,25px); line-height: 1.15; }
.book small { font-size: 7px; letter-spacing: 1px; }
.book>span { font-size: 6px; }
.product-art:hover .book { transform: rotate(-2deg) translateY(-7px); box-shadow: 12px 24px 23px #03172b20; }
.art-number { font-family: var(--display); font-size: 64px; bottom: 5px; right: 10px; color: #87765718; }
.art-planner { background: #deded7; }
.art-planner .book { background: #fbf7ed; transform: rotate(5deg); border-left-color: #d8cebd; }
.art-planner .book::after { content: ''; position: absolute; inset: 50% 15px 18%; background: repeating-linear-gradient(transparent 0 13px,#c7c2b640 13px 14px); z-index: -1; }
.art-planner:hover .book { transform: rotate(1deg) translateY(-7px); }
.art-curso { background: #d9e0df; }
.art-curso .book { width: 79%; height: 60%; transform: rotate(-3deg); border: 7px solid #193346; border-bottom-width: 17px; padding: 15px; }
.art-curso .book strong { font-family: 'Segoe UI',Arial,sans-serif; font-size: clamp(15px,1.45vw,20px); font-weight: 600; }
.art-curso .book>span { display: none; }
.art-material { background: #e4d6c2; }
.art-material .book { background: #3c4d4c; transform: rotate(5deg); }
.art-material:hover .book { transform: rotate(1deg) translateY(-7px); }
.product-content { padding: 25px 0 0; }
.product-content h3 { font-size: 17px; font-weight: 600; line-height: 1.4; }
.product-content p, .products .product-content p { font-size: 12px; color: #65717b; line-height: 1.8; }
.product-bottom { border-top-color: #ded8cd; padding-top: 18px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; }
.product-bottom strong { font-size: 11px; font-weight: 600; margin: 0; }
.product-bottom a { gap: 8px; font-size: 11px; }
.service-layout { gap: 110px; }
.service-card { padding: 26px 0; position: relative; transition: padding .4s var(--ease-out); }
.service-card::before { content: ''; position: absolute; left: 0; right: 0; bottom: -1px; height: 1px; background: #a37e4e; transform: scaleX(0); transform-origin: left; transition: transform .5s var(--ease-out); }
.service-card:hover::before { transform: scaleX(1); }
.service-card:hover { padding-left: 10px; }
.service-card small { letter-spacing: 1px; color: #8d6e44; }
.service-card h3 { font-size: 21px; font-weight: 500; }
.about-section { background: #eaece7; }
.about-grid { gap: 100px; }
.about-image { margin-right: 0; }
.about-image .portrait { min-height: 520px; }
.image-note { right: -24px; bottom: 35px; transform: none; background: #f6f2e9; padding: 22px 30px; font-family: var(--display); font-style: italic; font-size: 22px; }
blockquote { font-family: var(--display); font-size: 26px; border-left: 0; border-top: 1px solid #bbc3bc; padding: 25px 0 0; font-style: italic; color: #385244; }
.timeline article { border-top-color: #c7b89e; padding-top: 30px; }
.timeline span { font-family: var(--display); font-size: 25px; color: #9a7547; }
.timeline h3 { font-size: 18px; font-weight: 500; }
.timeline article::before { width: 5px; height: 5px; top: -3px; background: #ac8858; }
.articles { background: #f0eee9; }
.blog-grid { gap: 35px; }
.editorial-art { background: #d8cbb7; padding: 35px; transition: background .4s; }
.editorial-art>span { font-family: var(--display); font-size: clamp(28px,3.1vw,44px); font-weight: 400; text-transform: lowercase; letter-spacing: -.04em; transition: transform .7s var(--ease-out); }
.editorial-art:hover>span { transform: translateY(-5px); }
.editorial-art>b { transition: transform .7s var(--ease-out); }
.editorial-art:hover>b { transform: translate(6px,-6px); }
.editorial-1 { background: #ccd4d3; }
.editorial-2 { background: #263e49; }
.blog-card h3 { font-family: var(--display); font-size: 25px; font-weight: 400; line-height: 1.25; }
.blog-card h3 a { transition: color .25s; }
.blog-card h3 a:hover { color: #8c6637; }
.article-meta { margin-top: 25px; }
.newsletter { background: #0b283d; }
.newsletter h2 { font-size: clamp(2.4rem,4vw,3.7rem); }
.newsletter .eyebrow { color: #ceb18b; }
.newsletter-grid { gap: 90px; }
.newsletter input { background: transparent; border-radius: 0; border-width: 0 0 1px; padding: 14px 0; }
.newsletter .input-button { gap: 20px; }
.newsletter .btn { border-radius: 2px; }
input, textarea, select { transition: border-color .25s, box-shadow .25s; border-radius: 2px; }
.final-cta { padding-block: 120px; }
.final-cta h2 { font-family: var(--display); font-weight: 400; font-size: clamp(2.5rem,4.5vw,4.3rem); }
footer { background: #041b2d; }
.page-hero { padding-block: 90px; }
.page-hero h1 { font-family: var(--display); font-weight: 400; letter-spacing: -.045em; }
.detail-grid h1 { font-family: var(--display); font-weight: 400; }
.detail-art { aspect-ratio: 1; }
.detail-art .book { height: 74%; }
.filter { background: transparent; border-color: #d7d1c6; border-radius: 2px; transition: background .25s, color .25s, border-color .25s; }
.filter:hover { border-color: #998263; }
.back-top { position: fixed; right: 24px; bottom: 24px; width: 46px; height: 46px; z-index: 20; background: var(--paper); border: 1px solid #c6b69d; color: var(--navy-900); font-size: 22px; opacity: 0; visibility: hidden; transform: translateY(8px); transition: opacity .3s, visibility .3s, transform .4s var(--ease-out), background .25s; }
.back-top.visible { opacity: 1; visibility: visible; transform: none; }
.back-top:hover { background: #ebdfcf; }
.menu-lines { width: 19px; display: grid; gap: 6px; margin: auto; }
.menu-lines i { display: block; width: 19px; height: 1px; background: currentColor; transition: transform .35s var(--ease-out); }
.menu-toggle[aria-expanded='true'] .menu-lines i:first-child { transform: translateY(3.5px) rotate(45deg); }
.menu-toggle[aria-expanded='true'] .menu-lines i:last-child { transform: translateY(-3.5px) rotate(-45deg); }
/* Content remains visible even if animation APIs fail or scripts are disabled. */
.reveal-ready { opacity: 1; transform: none; }
@media (min-width:1600px) { .hero-grid { min-height: 760px; } .hero .portrait { height: 575px; } }
@media (max-width:1200px) {
  .hero-grid { gap: 25px; }
  .hero .actions { align-items: flex-start; flex-direction: column; gap: 18px; }
  .hero h1 { font-size: clamp(55px,6.9vw,80px); }
  .hero-benefits { gap: 20px; }
  .product-grid { gap: 24px; }
  .channel-grid, .about-grid, .service-layout { gap: 55px; }
  .portrait-caption { font-size: 19px; }
}
@media (max-width:1024px) {
  .section { padding-block: 75px; }
  .header-inner { min-height: 78px; }
  nav { display: flex; opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(-8px); transition: opacity .25s, transform .35s var(--ease-out), visibility .25s; max-height: calc(100dvh - 78px); overflow-y: auto; padding: 22px 30px 30px; }
  nav.open { opacity: 1; visibility: visible; pointer-events: auto; transform: none; }
  nav>a:not(.btn)::before { display: none; }
  .header-cta { min-height: 44px; }
  .menu-toggle { border: 0; }
  .hero-grid { min-height: 630px; gap: 30px; }
  .hero .portrait { height: 470px; }
  .hero-quote { bottom: 35px; padding: 18px 22px; font-size: 25px; }
  .hero-copy { padding-block: 55px 40px; }
  .hero-benefits { padding-top: 25px; margin-top: 30px; gap: 12px; }
  .hero-benefits>span { font-size: 9px; }
  .portrait-edition, .portrait-caption, .portrait-note { left: 30px; }
  .intro .section-heading { gap: 0 40px; }
  .intro h2 { font-size: 43px; }
  .product-art { aspect-ratio: 1.2; }
  .book { padding: 25px; }
  .book strong { font-size: 29px; }
  .art-curso .book strong { font-size: 23px; }
  .about-image .portrait { min-height: 470px; }
  .image-note { right: -15px; font-size: 20px; padding: 20px; }
  .newsletter-grid { gap: 50px; }
  .input-button { flex-direction: column; align-items: flex-start; }
  .input-button button { margin-top: 10px; }
}
@media (max-width:768px) {
  .hero-grid { grid-template-columns: 1fr; gap: 0; }
  .hero .eyebrow { font-size: 9px; }
  .hero h1 { font-size: clamp(55px,10.5vw,80px); }
  .hero-copy { padding-block: 55px 20px; }
  .hero .actions { flex-direction: row; align-items: center; gap: 25px; }
  .hero-benefits { justify-content: space-between; max-width: 480px; }
  .hero-benefits>span { font-size: 11px; }
  .hero-visual { max-width: 560px; padding: 30px 20px 65px 0; min-height: 0; }
  .hero .portrait { height: 400px; min-height: 0; border-radius: 0; }
  .hero-quote { right: 0; top: auto; bottom: 35px; font-size: 27px; }
  .portrait-monogram { font-size: 200px; }
  .intro .section-heading { display: block; margin-bottom: 45px; }
  .intro h2 { margin-bottom: 24px; font-size: clamp(38px,6vw,48px); }
  .intro .section-heading>p { max-width: 500px; }
  .pillars { gap: 24px; }
  .channel-grid, .about-grid, .service-layout { grid-template-columns: 1fr; gap: 40px; }
  .video-feature { aspect-ratio: 1.6; }
  .video-feature>strong { font-size: 50px; }
  .timeline article { padding: 0 0 30px 28px; border-top: 0; }
  .timeline article::before { top: 13px; left: -3px; }
  .timeline h3 { margin-top: 6px; }
  .about-image { max-width: 500px; margin-right: 15px; }
  .about-image .portrait { min-height: 440px; }
  .section-top { gap: 20px; }
  .editorial-art>span { font-size: 40px; }
  .blog-card h3 { font-size: 28px; }
  .newsletter-grid { gap: 35px; }
  .newsletter .input-button { flex-direction: row; align-items: center; }
  .newsletter .input-button button { margin: 0; }
  .final-cta { padding-block: 90px; }
  .detail-art .book strong { font-size: 35px; }
  .back-top { right: 18px; bottom: 18px; }
}
@media (max-width:480px) {
  .container { width: calc(100% - 40px); }
  .section { padding-block: 60px; }
  .header-inner { min-height: 74px; }
  .brand { font-size: 24px; }
  .hero .eyebrow { font-size: 7px; letter-spacing: 1px; }
  .hero-copy { padding-top: 45px; }
  .hero h1 { font-size: clamp(48px,12.8vw,59px); margin-bottom: 26px; }
  .hero .actions { flex-direction: column; align-items: flex-start; gap: 22px; }
  .hero .btn { padding: 15px 19px; font-size: 11px; width: 100%; }
  .hero-secondary { font-size: 12px; }
  .hero-benefits { gap: 10px; padding-top: 24px; margin-top: 28px; }
  .hero-benefits>span { font-size: 9px; }
  .hero-benefits b { font-size: 21px; }
  .hero-visual { padding: 26px 18px 65px 0; }
  .hero .portrait { height: 340px; }
  .portrait::before { inset: 16px; }
  .portrait-edition { top: 30px; left: 30px; font-size: 7px; }
  .portrait-caption { font-size: 20px; bottom: 68px; }
  .portrait-note { bottom: 35px; font-size: 7px; }
  .portrait-monogram { font-size: 170px; }
  .hero-quote { bottom: 40px; font-size: 23px; padding: 17px 22px; }
  .hero-bottom { padding-block: 20px; font-size: 8px; }
  .intro h2 { font-size: 38px; }
  .intro .section-heading>p { font-size: 14px; }
  .pillars { gap: 22px; }
  .pillars article { padding-left: 46px; }
  .pillars article>span { top: 20px; font-size: 24px; }
  .pillars p { font-size: 13px; }
  .channel-grid .video-feature { aspect-ratio: 1.25; padding: 28px; border-width: 6px; }
  .video-feature>strong { font-size: 43px; }
  .play { height: 50px; width: 50px; }
  .video-feature small { font-size: 8px; }
  .channel-features { gap: 15px; }
  .channel-features h3 { font-size: 12px; }
  .channel-features p { font-size: 11px; }
  .product-grid { gap: 38px; }
  .product-art { aspect-ratio: 1.2; }
  .book { width: 57%; height: 79%; padding: 23px; }
  .book strong { font-size: 27px; }
  .book small { font-size: 7px; }
  .art-curso .book { height: 62%; }
  .art-curso .book strong { font-size: 24px; }
  .product-content { padding-top: 22px; }
  .product-content h3 { font-size: 19px; }
  .product-content p { font-size: 13px; }
  .product-bottom strong, .product-bottom a { font-size: 12px; }
  .service-card h3 { font-size: 19px; }
  .service-card small { font-size: 8px; }
  .about-image .portrait { min-height: 380px; }
  .image-note { font-size: 19px; bottom: 24px; }
  blockquote { font-size: 25px; }
  .editorial-art { padding: 30px; }
  .editorial-art>span { font-size: 37px; }
  .newsletter .input-button { flex-direction: column; align-items: stretch; gap: 20px; }
  .newsletter .btn { width: 100%; }
  .page-hero { padding-block: 60px; }
  .page-hero h1 { font-size: 43px; }
  .detail-art .book { padding: 24px; }
  .detail-art .book strong { font-size: 28px; }
  .final-cta h2 { font-size: 38px; }
  .back-top { height: 42px; width: 42px; }
}
@media (prefers-reduced-motion:reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; }
  html { scroll-behavior: auto; }
  .btn:hover, .product-art:hover .book, .editorial-art:hover>span, .editorial-art:hover>b { transform: none; }
}

/* Page and section entrances are handled by main.js; quiz steps by quiz.js. */
.section[id], #main { scroll-margin-top: 100px; }
@media(hover:none) {
  .service-card:hover { padding-left: 0; }
  .product-art:hover .book { transform: none; }
}

/* Softer silhouettes, with larger curves reserved for the main visual blocks. */
:root {
  --radius-sm: 12px;
  --radius-md: 22px;
  --radius-lg: 36px;
}
.btn { border-radius: 999px; padding-inline: 27px; }
.header-cta { border-radius: 999px; padding-inline: 19px; }
.hero { border-radius: 0 0 52px 52px; }
.hero .portrait { border-radius: 140px 140px 32px 32px; }
.hero .portrait::before { border-radius: 120px 120px 20px 20px; }
.hero .portrait-edition { top: 65px; left: 0; right: 0; text-align: center; }
.hero .portrait-monogram { margin-top: -10px; }
.hero-quote { border-radius: 28px 28px 28px 8px; box-shadow: 0 12px 30px #03172b12; }
.portrait { border-radius: 36px 100px 36px 36px; }
.portrait::before { border-radius: 20px 80px 20px 20px; }
.image-note { border-radius: 24px 24px 8px 24px; box-shadow: 0 8px 30px #03172b08; }
.channel, .about-section, .articles { margin-inline: 18px; border-radius: 44px; }
.video-feature { border-radius: 34px; border-width: 6px; }
.video-feature::after { border-radius: 100%; }
.product-card { display:flex; flex-direction:column; border: 1px solid #e8e3db; border-radius: 24px; padding: 10px; background: #fffdf9; transition: border-color .3s, box-shadow .4s; }
.product-card:hover { border-color: #d2c3ac; box-shadow: 0 12px 32px #132c3e07; }
.product-art { border-radius: 17px; }
.product-content { display:flex; flex:1; flex-direction:column; padding: 24px 12px 14px; }
.product-content .product-bottom { margin-top:auto; }
.book { border-radius: 3px 8px 8px 3px; }
.art-curso .book { border-radius: 12px; }
.badge { border-radius: 999px; }
.detail-art { border-radius: 34px; }
.editorial-art { border-radius: 26px; }
.course-card>.editorial-art { border-radius: 34px; }
.service-card h3 span { border: 1px solid #d7cdbd; border-radius: 50%; width: 36px; height: 36px; display: grid; place-items: center; flex-shrink: 0; font-size: 16px; margin-top: -5px; transition: transform .4s var(--ease-out), background .3s, border-color .3s; }
.service-card:hover h3 span { background: #ede3d4; border-color: #c1a47e; }
input, select { border-radius: 999px; padding-inline: 20px; background: #fffdf9; }
textarea { border-radius: 20px; padding: 18px 20px; background: #fffdf9; }
.newsletter { border-radius: 44px 44px 0 0; }
.newsletter input { border: 1px solid #ffffff30; border-radius: 999px; padding: 15px 20px; background: #ffffff04; }
.newsletter .btn { border-radius: 999px; }
.filter { border-radius: 999px; }
.notice { border-radius: 0 18px 18px 0; }
.back-top { border-radius: 50%; box-shadow: 0 4px 20px #03172b0b; }
.menu-toggle { border-radius: 50%; }
footer { border-radius: 40px 40px 0 0; }
.page-hero { border-radius: 0 0 44px 44px; }
@media (max-width:1024px) {
  nav { border-radius: 0 0 24px 24px; box-shadow: 0 14px 25px #03172b15; }
  .hero .portrait { border-radius: 105px 105px 28px 28px; }
  .hero .portrait::before { border-radius: 88px 88px 16px 16px; }
  .hero .portrait-edition { top: 58px; }
  .channel, .about-section, .articles { margin-inline: 12px; border-radius: 34px; }
}
@media (max-width:768px) {
  .hero { border-radius: 0 0 36px 36px; }
  .hero .portrait { border-radius: 105px 105px 28px 28px; }
  .hero .portrait-edition { top: 54px; }
  .portrait { border-radius: 28px 85px 28px 28px; }
  .portrait::before { border-radius: 16px 67px 16px 16px; }
  .newsletter { border-radius: 34px 34px 0 0; }
}
@media (max-width:480px) {
  .hero, .page-hero { border-radius: 0 0 28px 28px; }
  .hero .portrait { border-radius: 90px 90px 24px 24px; }
  .hero .portrait::before { border-radius: 76px 76px 14px 14px; }
  .hero .portrait-edition { top: 45px; left: 0; }
  .hero-quote { border-radius: 22px 22px 22px 6px; }
  .hero .btn { font-size: 12px; }
  .channel, .about-section, .articles { margin-inline: 8px; border-radius: 28px; }
  .channel-grid .video-feature { border-radius: 25px; }
  .product-card { border-radius: 24px; }
  .product-art { border-radius: 17px; }
  .product-content { padding: 23px 12px 14px; }
  .editorial-art { border-radius: 22px; }
  .detail-art { border-radius: 26px; }
  .image-note { border-radius: 20px 20px 6px 20px; }
  .newsletter, footer { border-radius: 28px 28px 0 0; }
}

/* A clearer contemporary type system, with a restrained signature serif. */
:root { --display: 'DM Sans','Segoe UI',Arial,sans-serif; }
body { font-family: 'DM Sans','Segoe UI',Arial,sans-serif; }
h2 { font-weight: 600; letter-spacing: -.045em; font-size: clamp(2rem,3.3vw,3.1rem); line-height: 1.16; }
.hero h1 { font-family: 'DM Sans','Segoe UI',Arial,sans-serif; font-weight: 500; font-size: clamp(2.4rem,4vw,3.5rem); letter-spacing: -.04em; line-height: 1.17; }
.hero-line-accent { font-family: 'DM Serif Display',Georgia,serif; font-weight: 400; letter-spacing: -.025em; }
.hero .eyebrow { font-size: 10px; }
.hero-copy>p { font-size: 16px; }
.page-hero h1,.detail-grid h1 { font-weight: 500; letter-spacing: -.055em; }
.intro h2 { font-size: clamp(1.85rem,2.8vw,2.65rem); }
.newsletter h2,.final-cta h2 { font-weight: 500; }
.blog-card h3 { font-weight: 500; font-size: 23px; }
.video-feature>strong,.book strong,.editorial-art>span,.hero-quote,blockquote,.image-note { font-family: 'DM Serif Display',Georgia,serif; }
.portrait-monogram { font-family: 'DM Serif Display',Georgia,serif; }
.brand { font-weight: 600; }
.editable-copy { white-space: pre-line; }
.content-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position:var(--image-x,50%) var(--image-y,50%); transform:scale(var(--image-zoom,1)); transform-origin:center; }
.official-photo img { width: 100%; height: 100%; object-fit: cover; }
.official-photo::before,.official-photo::after { display: none; }
.course-cover-frame { width:100%; aspect-ratio:1.7; overflow:hidden; border-radius:25px; margin-bottom:35px; }
.course-cover { width: 100%; height:100%; object-fit: cover; object-position:var(--image-x,50%) var(--image-y,50%); transform:scale(var(--image-zoom,1)); transform-origin:center; }
.content-materials{margin-top:55px;padding-top:35px;border-top:1px solid #dfe2df}.content-materials-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}.content-material{margin:0;border:1px solid #dfe2df;border-radius:18px;overflow:hidden;background:#f8f7f3}.content-material img,.content-material video{display:block;width:100%;max-height:520px;object-fit:contain;background:#071b2d}.content-material figcaption{padding:11px 15px;color:#526575;font-size:13px;overflow-wrap:anywhere}.content-material-pdf{display:grid;grid-template-columns:auto 1fr;gap:5px 14px;align-items:center;padding:20px}.content-material-pdf strong{grid-row:1/3;display:grid;place-items:center;width:54px;height:54px;border-radius:12px;background:#9e3930;color:white;font-size:12px}.content-material-pdf span{font-weight:700;overflow-wrap:anywhere}.content-material-pdf small{color:#667085}@media(max-width:650px){.content-materials-grid{grid-template-columns:1fr}}
.course-card+.course-card { margin-top: 65px; }
.reading p { overflow-wrap: anywhere; }
.form-honeypot{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important}.privacy-check{display:flex!important;align-items:flex-start;gap:10px;margin:4px 0 20px;font-size:12px;font-weight:400;line-height:1.55}.privacy-check input{flex:0 0 auto;width:auto;margin:4px 0 0}.privacy-check a{text-decoration:underline;text-underline-offset:2px}.contact-form button:disabled{cursor:wait;opacity:.65}
@media(max-width:768px) { .hero h1 { font-size: clamp(36px,6.5vw,48px); } }
@media(max-width:480px) { .hero h1 { font-size: clamp(32px,8.5vw,40px); } .hero .eyebrow { font-size: 8px; } .hero-copy>p { font-size: 15px; } .intro h2 { font-size: 29px; } .page-hero h1 { font-size: 32px; } }

/* Photo framing configured in the administration panel. */
.official-photo img { object-position: var(--photo-x,50%) var(--photo-y,50%); transform: scale(var(--photo-zoom,1)); }
.official-photo { top: var(--photo-offset,0px); }
.hero .official-photo { background: var(--navy-900); border: 0; }

/* A compact hierarchy and an uncropped, top-aligned opening portrait. */
:root { --container: 1180px; }
body { line-height: 1.7; }
h2, .final-cta h2 { font-size: clamp(1.75rem,2.4vw,2.4rem); letter-spacing: -.03em; line-height: 1.26; text-wrap: balance; }
.page-hero h1, .detail-grid h1 { font-size: clamp(2rem,3.5vw,3.2rem); line-height: 1.18; text-wrap: balance; }
.hero h1 { max-width: 590px; }
.hero-line-accent { line-height: 1.2; }
.header-inner { min-height: 72px; }
.brand { font-size: 23px; letter-spacing: -.8px; }
.brand-arrow { font-size: 25px; }
.header-cta { font-size: 10px; padding: 10px 15px; }
.header.scrolled { background: #03172bf2; backdrop-filter: blur(14px); }
.hero { background: radial-gradient(ellipse at 85% 40%,#16394c 0,transparent 55%),#03172b; border-radius: 0 0 36px 36px; }
.hero-grid { min-height: 590px; grid-template-columns: 1.12fr 1fr; gap: 48px; }
.hero-copy { padding-block: 54px 38px; }
.hero .eyebrow { margin-bottom: 22px; }
.hero-copy>p { max-width: 440px; line-height: 1.8; }
.hero-benefits { margin-top: 28px; padding-top: 26px; }
.hero-visual { padding: 28px 20px 50px 0; }
.hero .official-photo {
  display: block;
  top: 0;
  height: 510px;
  min-height: 0;
  padding: max(28px,var(--photo-offset,0px)) 16px 0;
  border-radius: 30px;
  background: radial-gradient(ellipse at 55% 45%,#24475a 0,#0a2336 70%);
  box-shadow: inset 0 0 0 1px #ffffff0d,0 24px 60px #00000014;
}
.hero .official-photo img {
  /* Keep the crown below the frame, including when a saved zoom is applied. */
  object-fit: contain;
  object-position: var(--photo-x,50%) top;
  transform-origin: var(--photo-x,50%) top;
}
.hero-quote { bottom: 26px; padding: 18px 23px; font-size: 24px; border-radius: 20px 20px 20px 6px; }
.vertical-label { top: 78px; }
.section { padding-block: 78px; }
.section-heading { margin-bottom: 42px; }
.intro .section-heading { margin-bottom: 44px; }
.channel, .about-section, .articles { border-radius: 30px; }
.product-card { transition: transform .45s var(--ease-out),border-color .3s,box-shadow .45s; }
.blog-card { transition: transform .45s var(--ease-out); }
.product-content h3 { line-height: 1.4; }
.hero .actions .btn, .hero-secondary { font-size: 12px; }
.hero-benefits>span { font-size: 11px; }
.hero .eyebrow { line-height: 1.7; }
.btn-primary { box-shadow: 0 4px 16px #e8b46b0c; }
.btn:active { transform: translateY(0) scale(.98); }
.final-cta { background: radial-gradient(ellipse at center,#eee5d5 0,transparent 70%); }
@media (hover:hover) and (prefers-reduced-motion:no-preference) {
  .product-card:hover { transform: translateY(-5px); box-shadow: 0 18px 36px #132c3e0c; }
  .blog-card:hover { transform: translateY(-4px); }
}
@media (max-width:1024px) {
  nav { top: 72px; max-height: calc(100dvh - 72px); }
  .hero-grid { gap: 30px; min-height: 550px; }
  .hero .official-photo { height: 460px; }
  .hero-benefits { gap: 14px; }
}
@media (max-width:768px) {
  .hero-grid { grid-template-columns: 1fr; gap: 0; }
  .hero-copy { padding-block: 42px 14px; }
  .hero-visual { width: 100%; max-width: 480px; justify-self: center; padding: 20px 18px 48px 0; }
  .hero .official-photo { height: clamp(360px,75vw,480px); }
  .hero-quote { font-size: 22px; bottom: 24px; }
  .section { padding-block: 60px; }
  .intro h2 { font-size: clamp(29px,4.5vw,36px); }
  .video-feature>strong { font-size: clamp(32px,6vw,46px); }
  .blog-editorial .blog-card:first-child h3 { font-size: 27px; }
}
@media (max-width:480px) {
  .header-inner { min-height: 66px; }
  nav { top: 66px; max-height: calc(100dvh - 66px); }
  .brand { font-size: 21px; }
  .hero .official-photo { height: 380px; border-radius: 24px; }
  .hero-quote { font-size: 20px; padding: 16px 19px; }
  .hero-benefits>span { font-size: 10px; }
  .eyebrow { margin-bottom: 18px; }
  .section { padding-block: 52px; }
  .page-hero { padding-block: 48px; }
  .channel-grid .video-feature { padding: 26px; }
}
