/* Accueil et présentation de l'espace web. Les captures sont celles de l'app. */
.home-page .hero{min-height:min(880px,100svh);padding-block:145px 70px}
.home-page .hero::after{content:"";position:absolute;inset:auto 0 0;height:110px;background:linear-gradient(transparent,#09110d);pointer-events:none;z-index:-1}
.home-page .hero .grid{grid-template-columns:minmax(0,1.12fr) minmax(0,1fr);gap:3rem;max-width:1440px}
.home-page .hero-copy{gap:1.5rem}
.home-page .hero h1.display{font-size:clamp(3.4rem,6.4vw,6.4rem);line-height:1.04;letter-spacing:-.055em;text-transform:none;font-stretch:95%;font-weight:750}
.home-page .hero .lead{max-width:43ch;line-height:1.65}
.home-page .hero-cta{gap:1.25rem;margin-top:.35rem}
.home-page .btn-primary{box-shadow:0 8px 28px rgba(173,255,77,.12);border-radius:14px}
.hero-price{font-size:.84rem;color:var(--text-secondary);margin-top:-.65rem}
.hero-price span{padding-inline:.35rem}
.home-page .hero-meta{gap:.65rem 1.15rem;max-width:40rem;font:400 .8rem/1.5 var(--font-body);text-transform:none;letter-spacing:0}
.home-page .hero-meta span{display:flex;align-items:center;gap:.45rem}
.home-page .hero-meta span::before{content:"";width:4px;height:4px;background:var(--tt-leaf);border-radius:50%}
.home-page .hero-cluster{height:560px;max-width:560px;isolation:isolate}
.home-page .hero-cluster .d-main{height:510px;transform:none}
.home-page .hero-cluster .d-back{height:390px;left:0;top:10%;transform:rotate(-7deg)}
.home-page .hero-cluster .d-front{height:360px;right:0;bottom:2%;transform:rotate(7deg)}
.home-benefits{position:relative;padding-block:0 5rem;background:var(--tt-background)}
.home-benefits .wrap{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2.5rem;max-width:1440px}
.home-benefits .wrap > div{display:flex;align-items:flex-start;gap:1rem;border-top:1px solid var(--tt-white-14);padding-top:1.4rem}
.benefit-number{font:500 .75rem/1.6 var(--font-mono);color:var(--tt-leaf);padding-top:.12rem}
.home-benefits p{font-size:.9rem;color:var(--text-secondary)}
.home-benefits strong{display:block;color:var(--text-primary);font-size:1rem;margin-bottom:.35rem}
.home-method{background:linear-gradient(180deg,#09110d,#11261b);padding-top:3rem;padding-bottom:6rem;scroll-margin-top:90px}
.method-heading{display:flex;justify-content:space-between;align-items:end;gap:2rem;margin-bottom:2.5rem}
.method-heading h2{margin-top:.9rem;font-size:clamp(2.7rem,4.8vw,4.6rem);text-transform:none;letter-spacing:-.04em;line-height:1.04;font-stretch:95%}
.method-heading .lead{max-width:27ch;font-size:1.05rem}
.method-tabs{display:flex;gap:.5rem;padding:.4rem;background:#17291e;border:1px solid rgba(173,255,77,.16);border-radius:16px;width:max-content;max-width:100%;margin-bottom:1.3rem}
.method-tabs[hidden],.method-panel[hidden]{display:none}
.method-tabs button{display:flex;align-items:center;justify-content:center;gap:.7rem;min-height:48px;padding:.75rem 1.6rem;border-radius:11px;font-size:.95rem;font-weight:650;color:#d0ddcf;transition:background .2s,color .2s}
.method-tabs button span{font:500 .7rem var(--font-mono);opacity:.75}
.method-tabs button[aria-selected="true"]{background:var(--tt-leaf);color:#09110d;box-shadow:0 2px 8px #0002}
.method-tabs button:hover:not([aria-selected="true"]){background:#243e2c;color:white}
.method-panel{display:grid;grid-template-columns:1fr .85fr;align-items:center;gap:3rem;background:#dcebd4;color:#10291b;border:1px solid #ecf5e7;border-radius:28px;padding:3rem 4rem;min-height:570px;overflow:hidden}
.method-panel + .method-panel{margin-top:1.5rem}
.method-panel[hidden] + .method-panel{margin-top:0}
.method-copy{max-width:440px}
.method-copy .kicker{color:#335c36}
.method-copy h3{font:800 clamp(1.9rem,3vw,3rem)/1.1 var(--font-display);letter-spacing:-.04em;margin-block:1rem 1.25rem;text-wrap:balance;overflow-wrap:normal}
.method-copy p{color:#354f3c;font-size:1.05rem;line-height:1.7}
.method-copy ul{margin-block:1.5rem 2rem;display:grid;gap:.65rem;font-size:.9rem;font-weight:600}
.method-copy li::before{content:"✓";color:#345c27;margin-right:.6rem}
.method-copy .link-underline{color:#163b25;display:inline-flex;align-items:center;gap:1rem;min-height:44px}
.method-copy .link-underline::after{background:#163b25}
.method-panel:focus-visible{outline-color:var(--tt-leaf)}
.method-media{display:flex;flex-direction:column;align-items:center;gap:1.2rem;position:relative}
.method-media::before{content:"";position:absolute;inset:15% -12%;border:1px solid #adc89e;border-radius:50%;transform:rotate(-18deg);pointer-events:none}
.method-media .device{width:210px;max-width:100%;height:auto}
.method-media .screen{box-shadow:0 24px 40px #18351b33;border-radius:25px}
.method-media figcaption{font:400 .7rem var(--font-mono);color:#446044;position:relative}
/* Un même fond relie la découverte des espèces aux engagements. */
.home-page .tease{background:linear-gradient(180deg,#11261b 0,#e6f5de 230px);padding-block:260px 4rem}
.home-page .tease .section-head{padding-top:0;margin-bottom:2rem}
.home-page .tease .section-head h2{margin-left:0}
.home-page .tease h2.display{font-size:clamp(2rem,4.1vw,3.7rem);text-transform:none;font-stretch:95%;line-height:1.1;letter-spacing:-.045em}
.home-page .tease-counter{gap:1.25rem}
.home-page .tease-counter .num{font-size:clamp(5rem,10vw,9rem);font-stretch:90%;line-height:1}
.home-page .tease-counter .tot{font:400 .84rem/1.5 var(--font-body);max-width:8ch}
.home-page .tease-band{margin-block:2.5rem 1.5rem}
.home-page .ttile{width:clamp(190px,20vw,280px);aspect-ratio:4/5;border-radius:14px}
.home-page .ttile .nm{opacity:1;z-index:1;bottom:18px;left:18px;font-size:.86rem;font-weight:600}
.home-page .ttile::after{opacity:1;background:linear-gradient(to top,#060e0acd,transparent 45%)}
.home-page .pokedex-hint{font:400 .84rem/1.65 var(--font-body);letter-spacing:0;text-transform:none;color:#405943}
.home-care{background:#e6f5de;color:#10291b;padding-block:3rem 1rem}
.care-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(3rem,7vw,7rem);align-items:center}
.care-portrait{position:relative;overflow:hidden;border-radius:160px 20px 20px 20px;isolation:isolate;aspect-ratio:1/1.12}
.care-portrait picture,.care-portrait img{height:100%;width:100%;object-fit:cover}
.care-portrait::after{content:"";position:absolute;inset:60% 0 0;background:linear-gradient(transparent,#06110de0);z-index:0}
.care-portrait figcaption{position:absolute;bottom:2rem;left:2rem;right:2rem;display:grid;gap:.35rem;color:white;z-index:1}
.care-portrait figcaption span:first-child{font:600 1.2rem var(--font-display)}
.care-portrait figcaption span:last-child{font-size:.75rem;color:#e0e9da}
.care-copy .kicker,.partner-note .kicker{color:#405e41;font-size:.68rem;letter-spacing:.12em}
.care-copy h2{font:750 clamp(2.2rem,4.3vw,4rem)/1.08 var(--font-display);letter-spacing:-.05em;margin:1.25rem 0 1.5rem}
.care-intro{font-size:1.02rem;line-height:1.8;color:#405943;max-width:42ch}
.care-principles{display:grid;gap:1.6rem;margin-block:2.2rem}
.care-principles > div{display:flex;gap:1rem}
.care-symbol{flex:none;font:500 .7rem/1.9 var(--font-mono);color:#527345;padding-top:.2rem}
.care-principles h3{font-size:1rem;font-weight:650;margin-bottom:.4rem}
.care-principles p{font-size:.88rem;color:#405943;max-width:40ch;line-height:1.65}
.care-links{display:flex;gap:1.5rem;flex-wrap:wrap}
.home-care .link-underline{color:#173e29;font-size:.9rem;display:inline-flex;align-items:center;gap:.7rem;min-height:44px}
.home-care .link-underline::after{background:#173e29}
.home-care :focus-visible,.method-panel :focus-visible{outline-color:#0e392b}
.partner-note{display:flex;align-items:center;gap:2rem;margin-top:clamp(4rem,8vw,7rem);padding-block:2.8rem;position:relative}
.partner-note::before{content:"";position:absolute;top:0;left:var(--page-x);right:var(--page-x);height:1px;background:#c2d5ba}
.partner-mark{flex:none;font:300 3rem var(--font-body);color:#4b7047}
.partner-note h2{font:650 clamp(1.3rem,2vw,1.8rem)/1.25 var(--font-display);letter-spacing:-.025em;margin-block:.5rem}
.partner-note p{font-size:.85rem;line-height:1.7;color:#405943}
.partner-note > a{margin-left:auto;flex-shrink:0}
.home-invitation{position:relative;text-align:center;background:linear-gradient(180deg,#e6f5de 0,#5f7c59 90px,#183121 180px,#09160e 270px,#060e0a 100%);padding:360px 0 90px;isolation:isolate}
.home-invitation::before{content:"";position:absolute;inset:260px 0 0;background:radial-gradient(ellipse at 50% 45%,#adff4d0e,transparent 65%);z-index:-1}
.home-invitation .wrap{display:flex;flex-direction:column;align-items:center}
.invitation-icon{border-radius:20px;margin-bottom:2rem;box-shadow:0 12px 60px #adff4d18;transform:rotate(-6deg)}
.home-invitation .kicker{font-size:.65rem;letter-spacing:.15em;color:#bdd59f}
.home-invitation h2{font:750 clamp(2.5rem,5.5vw,5rem)/1.07 var(--font-display);letter-spacing:-.05em;margin-block:1.5rem}
.home-invitation h2 span{color:#b5cd9b}
.home-invitation p{max-width:44ch;font-size:1rem;color:#a7b8a8;line-height:1.75}
.home-invitation .btn{margin-top:2rem;gap:1.5rem}
.home-invitation p.invitation-note{font-size:.76rem;margin-top:1.1rem;max-width:none}
.connection-main{display:grid;grid-template-columns:1.1fr .8fr;align-items:center;gap:clamp(3rem,7vw,7rem);min-height:90svh;padding-block:160px 80px;max-width:1360px}
.connection-copy{display:flex;align-items:flex-start;flex-direction:column;gap:1.5rem}
.connection-copy h1.display{font-size:clamp(2.8rem,5vw,5.2rem);line-height:1.07;text-transform:none;letter-spacing:-.045em;font-stretch:95%}
.connection-copy p:not(.lead){color:var(--text-tertiary);font-size:.95rem;max-width:48ch}
.connection-preview{padding:clamp(1.5rem,3vw,3rem);border:1px solid var(--tt-hairline);border-radius:28px;background:radial-gradient(at top right,#254b28,transparent 75%),#101f16}
.connection-preview h2{font:800 clamp(2rem,3vw,3rem)/1.15 var(--font-display);letter-spacing:-.03em;margin:1.4rem 0 2rem}
.connection-preview li{padding:1rem 0;border-top:1px solid var(--tt-white-14);color:#d7e6d6;font-size:.95rem}
.connection-preview p{font-size:.8rem;color:var(--text-tertiary);margin:1rem 0 2rem}
.connection-preview img{border-radius:20px}
@media(max-width:1100px){
 .home-page .hero{padding-top:130px;min-height:0}
 .home-page .hero .grid{gap:2rem}
 .home-page .hero h1.display{font-size:clamp(3rem,6.2vw,5rem)}
 .home-page .hero-cluster{height:450px}
 .home-page .hero-cluster .d-main{height:410px}
 .home-page .hero-cluster .d-back{height:300px}
 .home-page .hero-cluster .d-front{height:280px}
 .method-panel{padding:2.5rem;gap:2rem}
}
@media(max-width:760px){
 .home-page .hero{padding-block:120px 45px}
 .home-page .hero .grid{grid-template-columns:1fr;gap:2rem}
 .home-page .hero-copy{gap:1.25rem}
 .home-page .hero h1.display{font-size:clamp(2.75rem,10vw,4.2rem)}
 .home-page .hero .kicker{font-size:.64rem;letter-spacing:.1em}
 .home-page .hero .lead{font-size:1.02rem;max-width:40ch}
 .home-page .hero-visual{width:100%;max-width:420px}
 .home-page .hero-cluster{height:360px}
 .home-page .hero-cluster .d-main{height:345px}
 .home-page .hero-cluster .d-back{height:270px;left:6%}
 .home-page .hero-cluster .d-front{height:245px;right:6%}
 .home-page .hero-cta{gap:.4rem 1rem}
 .home-page .hero-meta{font-size:.73rem;gap:.4rem 1rem}
 .hero-price{font-size:.76rem}
 .home-benefits{padding-bottom:2.5rem}
 .home-benefits .wrap{grid-template-columns:1fr;gap:1.2rem}
 .home-benefits .wrap > div{padding-top:1.2rem}
 .method-heading{display:block;margin-bottom:1.75rem}
 .method-heading .lead{margin-top:1.25rem}
 .method-tabs{width:100%;gap:.2rem}
 .method-tabs button{flex:1;padding:.7rem .25rem;gap:.35rem;font-size:.87rem}
 .method-panel{grid-template-columns:1fr;padding:1.5rem;gap:2rem;min-height:0;border-radius:20px}
 .method-copy h3{font-size:2rem}
 .method-copy p{font-size:1rem}
 .method-copy ul{font-size:.85rem;margin-bottom:1rem}
 .method-media .device{width:185px}
 .method-media::before{inset:15% 0}
 .home-method{padding-bottom:3rem}
 .home-page .tease{padding-block:200px 2.5rem;background:linear-gradient(180deg,#11261b 0,#e6f5de 170px)}
 .home-page .tease .section-head{padding-top:0}
 .home-page .tease .section-head .row{align-items:flex-start;flex-direction:column;gap:1rem}
 .home-page .ttile{width:210px}
 .home-care{padding-top:1.5rem}
 .care-grid{grid-template-columns:1fr;gap:2.5rem}
 .care-portrait{aspect-ratio:1.12;border-top-left-radius:110px;max-height:440px}
 .care-portrait figcaption{left:1.5rem;bottom:1.5rem}
 .care-copy h2{font-size:2.6rem}
 .partner-note{flex-wrap:wrap;gap:1.2rem;padding-block:2rem}
 .partner-mark{display:none}
 .partner-note > a{margin-left:0}
 .home-invitation{padding:250px 0 65px;background:linear-gradient(180deg,#e6f5de 0,#5f7c59 60px,#183121 120px,#09160e 190px,#060e0a 100%)}
 .home-invitation h2{font-size:clamp(2.3rem,7.5vw,3.7rem)}
 .home-invitation .kicker{font-size:.58rem}
 .home-invitation p.invitation-note{font-size:.7rem}
 .connection-main{grid-template-columns:1fr;gap:3rem;padding-block:125px 60px}
}
@media(max-width:360px){.home-page .hero h1.display{font-size:2.3rem}.home-page .hero{padding-top:108px}}
