/*
Theme Name: Creciendo Cerca
Theme URI: https://creciendocerca.es/
Author: Carla · Creciendo Cerca
Description: Tema a medida para Creciendo Cerca: portada con fichas, cuestionario de orientación, dossier, asesoramiento, artículos y tienda con WooCommerce.
Version: 1.0.0
Requires at least: 6.3
Requires PHP: 7.4
Text Domain: creciendo-cerca
*/

/* Cálido y natural: arena, salvia y arcilla; formas orgánicas; detalles manuscritos. Layout: one long page like the real site — sticky nav, hero with the four verbs, shop grid filtered by theme, dossier offer, advice, about, FAQ, contact */
:root{
  --bg:#F4EDE3; --surface:#FBF7F1; --band:#EDE3D5; --ink:#3B3029; --muted:#7A6A5D; --line:#E2D6C6;
  --sage:#5F7D66; --sage-ink:#FFFFFF; --sage-soft:#DCE5D6;
  --lilac:#EBDCDD; --peach:#F0D6C6; --butter:#F1E3C2; --sky:#E1E4D0; --clay:#C98B6F;
  --chip-ink:#3B3029;
  --display:"Fraunces", Georgia, "Times New Roman", serif;
  --body:"Nunito", -apple-system, "Segoe UI", Roboto, sans-serif;
  --hand:"Caveat", "Segoe Print", "Bradley Hand", cursive;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#1E1915; --surface:#28211C; --band:#231D18; --ink:#F1E9DF; --muted:#B9A99A; --line:#3E342C;
  --sage:#9DBBA3; --sage-ink:#16201A; --sage-soft:#2F3B31;
  --lilac:#43353A; --peach:#4A3529; --butter:#463D29; --sky:#373A2B; --clay:#D9A288; --chip-ink:#F1E9DF; color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#1E1915; --surface:#28211C; --band:#231D18; --ink:#F1E9DF; --muted:#B9A99A; --line:#3E342C;
  --sage:#9DBBA3; --sage-ink:#16201A; --sage-soft:#2F3B31;
  --lilac:#43353A; --peach:#4A3529; --butter:#463D29; --sky:#373A2B; --clay:#D9A288; --chip-ink:#F1E9DF; color-scheme:dark}

*{box-sizing:border-box}
body{margin:0}
img{max-width:100%}
[hidden]{display:none!important}
body{background:var(--bg);color:var(--ink);font-family:var(--body);font-size:17px;line-height:1.6}
.wrap{max-width:1080px;margin:0 auto;padding-inline:20px}
h1,h2,h3{font-family:var(--display);font-variation-settings:"SOFT" 100;font-weight:500;line-height:1.15;letter-spacing:-.01em;text-wrap:balance;margin:0}
h2{font-size:clamp(1.7rem,3.5vw,2.3rem)}
h3{font-size:1.2rem}
p{margin:0}
a{color:var(--sage)}
.eyebrow{font-family:var(--hand);font-size:1.6rem;line-height:1;color:var(--clay);font-weight:600}
.lead{color:var(--muted);max-width:62ch}
section{padding-block:72px}
section + section{border-top:0}
section:nth-of-type(even){background:var(--band)}


header{position:sticky;top:env(safe-area-inset-top,0px);z-index:10;background:color-mix(in srgb,var(--bg) 94%,transparent);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-block:14px;flex-wrap:wrap}
.brand{font-family:var(--display);font-variation-settings:"SOFT" 100;font-size:1.25rem;font-weight:600;color:var(--ink);text-decoration:none}
.brand span{color:var(--sage)}
.nav ul{display:flex;gap:18px;list-style:none;margin:0;padding:0;flex-wrap:wrap}
.nav ul a{color:var(--muted);text-decoration:none;font-size:.95rem}
.nav ul a:hover,.nav ul a:focus-visible{color:var(--ink)}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:999px;padding:13px 24px;font:700 1rem var(--body);cursor:pointer;text-decoration:none;background:var(--sage);color:var(--sage-ink)}
.btn:hover{filter:brightness(1.06)}
.btn.ghost{background:transparent;color:var(--ink);border:1.5px solid var(--line)}
.btn:focus-visible,.chip:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid var(--sage);outline-offset:2px}

/* hero */
.hero{padding-block:64px 56px}
.hero-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:48px;align-items:center}
.hero h1{font-size:clamp(2.2rem,5.2vw,3.6rem);margin-top:12px}
.hero .lead{margin-top:18px;font-size:1.1rem}
.hero .actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.verbs{position:relative;aspect-ratio:1/1;max-width:440px;width:100%;justify-self:center}
.verbs div{position:absolute;display:grid;place-items:center;font-family:var(--hand);font-size:2rem;font-weight:600;color:var(--chip-ink)}
.verbs div:nth-child(1){left:2%;top:4%;width:52%;height:46%;background:var(--sage-soft);border-radius:58% 42% 50% 50% / 48% 56% 44% 52%;transform:rotate(-4deg)}
.verbs div:nth-child(2){right:0;top:12%;width:44%;height:40%;background:var(--lilac);border-radius:46% 54% 40% 60% / 55% 45% 55% 45%;transform:rotate(5deg)}
.verbs div:nth-child(3){left:10%;bottom:4%;width:44%;height:42%;background:var(--peach);border-radius:52% 48% 60% 40% / 42% 58% 42% 58%;transform:rotate(3deg)}
.verbs div:nth-child(4){right:4%;bottom:0;width:48%;height:44%;background:var(--butter);border-radius:40% 60% 46% 54% / 58% 42% 58% 42%;transform:rotate(-3deg)}
.quote{margin-top:28px;font-family:var(--hand);font-size:1.6rem;line-height:1.25;color:var(--clay)}

/* steps */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:36px}
.step{display:grid;gap:8px}
.step b{font-family:var(--hand);font-size:2.6rem;line-height:1;color:var(--clay);font-weight:600}
.step p{color:var(--muted)}

/* shop */
.filters{display:flex;gap:8px;flex-wrap:wrap;margin-top:28px}
.chip{border:1.5px solid var(--line);background:var(--surface);color:var(--ink);border-radius:999px;padding:7px 14px;font:500 .9rem var(--body);cursor:pointer}
.chip[aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.rail-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-top:28px}
.rail-nav{display:flex;gap:8px}
.rail-btn{width:44px;height:44px;border-radius:50%;border:1.5px solid var(--line);background:var(--surface);color:var(--ink);font-size:1.2rem;cursor:pointer;display:grid;place-items:center}
.rail-btn:hover{border-color:var(--sage)}
.rail-btn:focus-visible{outline:3px solid var(--sage);outline-offset:2px}
.grid{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(260px,300px);gap:18px;margin-top:18px;overflow-x:auto;scroll-snap-type:x mandatory;padding:4px 2px 16px;scrollbar-width:thin;scrollbar-color:var(--line) transparent;overscroll-behavior-x:contain}
.grid .card{scroll-snap-align:start}
.card{background:var(--surface);border:1px solid var(--line);border-radius:28px 22px 30px 24px;padding:24px;display:flex;flex-direction:column;gap:12px;min-width:0}
.card .top{display:flex;justify-content:space-between;align-items:center;gap:8px}
.num{font-variant-numeric:tabular-nums;color:var(--muted);font-size:.85rem}
.tag{font-size:.75rem;font-weight:600;padding:3px 10px;border-radius:999px;color:var(--chip-ink)}
.t-yo{background:var(--sage-soft)} .t-emo{background:var(--peach)} .t-lim{background:var(--lilac)} .t-gru{background:var(--butter)} .t-red{background:var(--sky)}
.card p{color:var(--muted);font-size:.95rem}
.mods{font-size:.82rem;color:var(--muted)}
.mods strong{color:var(--ink);font-weight:600}
.card .buy{margin-top:auto;display:flex;justify-content:space-between;align-items:center;gap:10px;padding-top:12px;border-top:1px solid var(--line)}
.price{font-family:var(--display);font-size:1.3rem;font-variant-numeric:tabular-nums}
.card .btn{padding:9px 16px;font-size:.92rem}
.note{margin-top:20px;font-size:.92rem;color:var(--muted)}

/* dossier */
.offer{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start}
.offer-box{background:var(--surface);border:1px solid var(--line);border-radius:36px 28px 40px 30px;padding:32px;display:grid;gap:18px}
.offer-box .big{font-family:var(--display);font-size:3rem;line-height:1;font-variant-numeric:tabular-nums}
.offer-box .big small{font-size:1rem;color:var(--muted);font-family:var(--body)}
.coupon{background:var(--butter);color:var(--chip-ink);border-radius:12px;padding:12px 16px;font-size:.93rem}
ul.check{list-style:none;padding:0;margin:0;display:grid;gap:10px}
ul.check li{padding-left:28px;position:relative}
ul.check li::before{content:"";position:absolute;left:4px;top:.55em;width:12px;height:7px;border-left:2px solid var(--sage);border-bottom:2px solid var(--sage);transform:rotate(-45deg)}

/* advice + about */
.two{display:grid;grid-template-columns:1fr 1fr;gap:48px}
.two > div{display:grid;gap:16px;align-content:start;min-width:0}
.aside{background:var(--sage-soft);border-radius:16px;padding:20px;font-size:.95rem;color:var(--chip-ink)}

/* about */
.about{display:grid;grid-template-columns:.8fr 1.2fr;gap:56px;align-items:center}
.photo{margin:0}
.photo{position:relative}
.photo::before{content:"";position:absolute;inset:6% -6% -5% 8%;background:var(--sage-soft);border-radius:56% 44% 48% 52% / 46% 52% 48% 54%;z-index:0}
.photo-img{position:relative;z-index:1;display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;object-position:50% 20%;border-radius:48% 52% 44% 56% / 38% 40% 60% 62%}
.photo-ph{aspect-ratio:4/5;max-width:100%;border-radius:200px 200px 24px 24px;background:linear-gradient(160deg,var(--sage-soft),var(--lilac));display:grid;place-items:center;align-content:center;gap:8px;color:var(--chip-ink)}
.photo-ph span{font-family:var(--display);font-size:5rem;line-height:1;opacity:.6}
.photo-ph small{font-size:.9rem;opacity:.75}
.about-text{display:grid;gap:16px;min-width:0}
.definition{font-family:var(--display);font-variation-settings:"SOFT" 100;font-style:italic;font-size:1.35rem;line-height:1.4;color:var(--ink)}
.about-text > p:not(.definition):not(.eyebrow){color:var(--muted)}
.creds{display:flex;gap:10px;flex-wrap:wrap;list-style:none;padding:0;margin:0}
.creds li{background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:6px 14px;font-size:.88rem}
@media (max-width:860px){.about{grid-template-columns:1fr;gap:28px}.photo{max-width:320px}}

.gift{background:var(--sage-soft);color:var(--chip-ink);border-radius:14px;padding:18px 20px;display:grid;gap:6px}
.gift p:last-child{font-size:.95rem}
.adv-head{display:grid;gap:16px;max-width:760px}
.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:32px}
.plan{background:var(--surface);border:1px solid var(--line);border-radius:28px 22px 30px 24px;padding:24px;display:grid;gap:8px;align-content:start}
.plan p{color:var(--muted);font-size:.95rem}
.adv-foot{display:flex;align-items:center;gap:28px;flex-wrap:wrap;margin-top:28px}
.rate{display:flex;align-items:center;gap:14px}
.rate .big{font-family:var(--display);font-size:2.6rem;line-height:1;font-variant-numeric:tabular-nums}
.rate span:last-child{color:var(--muted);font-size:.92rem;line-height:1.35}
#asesoramiento .aside{margin-top:32px;max-width:760px}
@media (max-width:760px){.plans{grid-template-columns:1fr}}

.who{margin-top:32px;display:grid;gap:14px}
.who ul{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.who li{display:grid;gap:6px;padding:18px 20px;border-radius:16px;color:var(--chip-ink)}
.who li:nth-child(1){background:var(--sage-soft)} .who li:nth-child(2){background:var(--lilac)} .who li:nth-child(3){background:var(--peach)}
.who li span{font-size:.95rem}
@media (max-width:760px){.who ul{grid-template-columns:1fr}}

.pillars{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.pillars li{display:grid;gap:2px;padding-left:16px;border-left:3px solid var(--sage-soft)}
.pillars li span{color:var(--muted)}
.posts{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:28px}
.post{background:var(--surface);border:1px solid var(--line);border-radius:28px 22px 30px 24px;padding:24px;display:grid;gap:10px;align-content:start}
.post .soon{font-size:.75rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.post p{color:var(--muted);font-size:.95rem}
@media (max-width:760px){.posts{grid-template-columns:1fr}}

.belief{margin:0;font-family:var(--hand);font-size:1.7rem;font-weight:500;line-height:1.25;padding:16px 20px;border-radius:14px;background:var(--lilac);color:var(--chip-ink)}
.quiz-wrap{display:grid;grid-template-columns:.85fr 1.15fr;gap:48px;align-items:start}
.quiz-intro{display:grid;gap:14px}
.quiz{background:var(--surface);border:1px solid var(--line);border-radius:36px 28px 40px 30px;padding:28px;display:grid;gap:18px;min-width:0}
.q-meta{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:.85rem;color:var(--muted)}
.q-bar{height:6px;border-radius:99px;background:var(--line);overflow:hidden}
.q-bar i{display:block;height:100%;background:var(--sage);transition:width .3s}
.q-title{font-family:var(--display);font-size:1.35rem;line-height:1.3;font-weight:600}
.q-opts{display:grid;gap:10px}
.q-opt{text-align:left;font:600 1rem var(--body);color:var(--ink);background:var(--bg);border:1.5px solid var(--line);border-radius:12px;padding:12px 16px;cursor:pointer}
.q-opt:hover{border-color:var(--sage)}
.q-opt:focus-visible{outline:3px solid var(--sage);outline-offset:2px}
.q-back{background:none;border:0;color:var(--muted);font:500 .9rem var(--body);cursor:pointer;padding:0;justify-self:start}
.q-back:hover{color:var(--ink)}
.r-main{display:grid;gap:10px;padding:20px;border-radius:16px;background:var(--sage-soft);color:var(--chip-ink)}
.r-main h3{font-size:1.5rem}
.r-list{display:grid;gap:14px}
.r-item{display:grid;gap:4px}
.r-item b{font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;color:var(--sage)}
.r-item p{color:var(--ink)}
.r-alt{display:flex;flex-wrap:wrap;gap:8px}
.r-alt span{font-size:.88rem;padding:5px 12px;border-radius:999px;background:var(--bg);border:1px solid var(--line)}
.r-actions{display:flex;gap:10px;flex-wrap:wrap}
@media (max-width:860px){.quiz-wrap{grid-template-columns:1fr;gap:24px}}

/* faq */
details{border-bottom:1px solid var(--line);padding-block:16px}
summary{cursor:pointer;font-weight:600;list-style:none;display:flex;justify-content:space-between;gap:16px}
summary::after{content:"+";color:var(--sage);font-size:1.3rem;line-height:1}
details[open] summary::after{content:"–"}
details p{color:var(--muted);margin-top:10px;max-width:70ch}
.faq{margin-top:28px;max-width:780px}

/* contact */
form{display:grid;gap:14px;max-width:560px}
label{font-weight:500;font-size:.95rem;display:grid;gap:6px}
input,textarea,select{font:inherit;color:var(--ink);background:var(--surface);border:1.5px solid var(--line);border-radius:10px;padding:11px 13px;width:100%}
textarea{min-height:120px;resize:vertical}
.small{font-size:.85rem;color:var(--muted)}
#sent{background:var(--sage-soft);color:var(--chip-ink);padding:12px 16px;border-radius:10px}

footer{border-top:1px solid var(--line);padding-block:36px;font-size:.9rem;color:var(--muted)}
.foot{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap}
.foot ul{list-style:none;padding:0;margin:0;display:flex;gap:16px;flex-wrap:wrap}

.toast{position:fixed;left:50%;bottom:calc(20px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:var(--ink);color:var(--bg);padding:12px 18px;border-radius:12px;font-size:.92rem;max-width:calc(100% - 32px);z-index:20}

@media (max-width:860px){
  .hero-grid,.offer,.two{grid-template-columns:1fr}
  .verbs div{font-size:1.6rem}
  .verbs{max-width:420px}
}
@media (max-width:580px){
  .steps{grid-template-columns:1fr}
  .grid{grid-auto-columns:82%}
  section{padding-block:52px}
  .nav ul{gap:12px}
}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
html{scroll-behavior:smooth}
section[id]{scroll-margin-top:80px}

/* ===== WordPress ===== */
.cc-notices{padding-top:16px}
.cc-notices:empty{display:none}
.woocommerce-message,.woocommerce-info,.woocommerce-error,.cc-flash{list-style:none;margin:0 0 12px;padding:14px 18px;border-radius:16px;background:var(--sage-soft);color:var(--chip-ink);border:0}
.woocommerce-error{background:var(--peach)}
.woocommerce-message .button,.woocommerce-info .button{float:right;margin-left:12px}
.page-main{padding-block:56px 72px}
.page-main .entry{max-width:760px}
.page-main.wide .entry{max-width:none}
.entry h1{font-size:clamp(2rem,4.4vw,3rem);margin-bottom:20px}
.entry h2{font-size:1.6rem;margin:36px 0 12px}
.entry h3{margin:24px 0 8px}
.entry p,.entry ul,.entry ol{margin:0 0 16px}
.entry img{border-radius:20px;height:auto}
.entry a{color:var(--sage)}
.post-meta{color:var(--muted);font-size:.92rem;margin-bottom:24px}
.post-list{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:28px}
.post a{color:inherit;text-decoration:none}
.post a:hover h3{color:var(--sage)}
.post-thumb{width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:18px}
.pagination{margin-top:32px;display:flex;gap:10px}
@media (max-width:760px){.post-list{grid-template-columns:1fr}}
.card h3 a{color:inherit;text-decoration:none}
.card h3 a:hover{color:var(--sage)}
.skip-link{position:absolute;left:-9999px}
.skip-link:focus{left:16px;top:16px;z-index:100;background:var(--surface);padding:8px 12px;border-radius:8px}
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px)}
.hp{position:absolute!important;left:-9999px}

/* WooCommerce */
.woocommerce .button,.woocommerce button.button,.woocommerce a.button,.woocommerce input.button,.woocommerce #respond input#submit,
.woocommerce a.button.alt,.woocommerce button.button.alt,.wc-proceed-to-checkout .checkout-button,#place_order{
  background:var(--sage)!important;color:var(--sage-ink)!important;border:0;border-radius:999px!important;padding:12px 22px!important;font:700 1rem var(--body)!important;text-decoration:none}
.woocommerce .button:hover{filter:brightness(1.06)}
.woocommerce table.shop_table{border-radius:18px;border-color:var(--line);background:var(--surface)}
.woocommerce table.shop_table td,.woocommerce table.shop_table th{border-color:var(--line)}
.woocommerce form .form-row input.input-text,.woocommerce form .form-row textarea,.woocommerce form .form-row select{background:var(--surface);border:1.5px solid var(--line);border-radius:10px;padding:11px 13px;color:var(--ink)}
.woocommerce-checkout #payment{background:var(--surface);border-radius:18px}
.woocommerce div.product .product_title{font-size:clamp(1.8rem,4vw,2.6rem)}
.woocommerce div.product p.price,.woocommerce div.product span.price{color:var(--sage);font-family:var(--display);font-size:1.6rem}
.woocommerce ul.products li.product .price{color:var(--sage)}
.woocommerce span.onsale{background:var(--clay)}
.woocommerce div.product div.images img{border-radius:24px}
.cc-box{background:var(--sage-soft);color:var(--chip-ink);border-radius:20px;padding:20px 22px;margin:20px 0;display:grid;gap:8px}
.cc-box code{font-size:1.2rem;font-weight:700;background:var(--surface);padding:4px 10px;border-radius:8px;color:var(--ink)}
.cc-consent{margin:14px 0;padding:14px 16px;background:var(--surface);border:1px solid var(--line);border-radius:14px;font-size:.92rem}
.cc-consent label{display:flex;gap:10px;align-items:flex-start;font-weight:400}
.cc-consent input{width:auto;margin-top:4px}