:root{
  --ink:#102f3d;
  --ink-2:#1a4050;
  --ink-soft:#315b69;
  --powder:#dbeef2;
  --powder-2:#edf7f8;
  --cream:#fbf7ef;
  --cream-2:#fffdf9;
  --sand:#d8c6b3;
  --sand-2:#eee0d1;
  --champagne:#c7a86c;
  --champagne-2:#e6d4aa;
  --taupe:#857468;
  --brown:#362d28;
  --rose:#eadbd3;
  --green:#cbd8ce;
  --danger:#a74f4f;
  --ok:#486f62;
  --warning:#a77435;
  --shadow:0 24px 70px rgba(16,47,61,.14);
  --shadow-soft:0 14px 40px rgba(16,47,61,.10);
  --radius:30px;
  --radius-lg:44px;
  --max:1180px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color:var(--brown);
  background:
    radial-gradient(circle at 12% 2%, rgba(219,238,242,.8), transparent 30rem),
    radial-gradient(circle at 88% 8%, rgba(234,219,211,.75), transparent 28rem),
    linear-gradient(180deg, #fffdf9 0%, #fbf7ef 44%, #f7efe7 100%);
  min-height:100vh;
  overflow-x:hidden;
}
body.no-scroll{overflow:hidden}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button,input,textarea,select{font:inherit}
button{cursor:pointer}
.grain{
  position:fixed; inset:0; pointer-events:none; z-index:0; opacity:.28;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 240 240' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='240' height='240' filter='url(%23n)' opacity='.16'/%3E%3C/svg%3E");
  mix-blend-mode:multiply;
}
.app-shell{position:relative;z-index:1}

.site-header{
  position:sticky; top:14px; z-index:50;
  width:min(calc(100% - 28px), 1240px);
  margin:14px auto 0;
  display:flex; align-items:center; gap:18px;
  padding:12px 14px 12px 16px;
  background:rgba(255,253,249,.74);
  border:1px solid rgba(199,168,108,.22);
  border-radius:999px;
  box-shadow:0 20px 50px rgba(16,47,61,.10);
  backdrop-filter:blur(22px);
}
.brand{display:flex; align-items:center; gap:12px; flex:0 0 auto; min-width:210px}
.brand img{width:48px;height:48px;border-radius:50%;object-fit:cover;box-shadow:0 10px 22px rgba(16,47,61,.18)}
.brand strong{display:block;font-family:"Cormorant Garamond", Georgia, serif;font-size:22px;line-height:1;color:var(--ink)}
.brand small{display:block;text-transform:uppercase;letter-spacing:.22em;font-size:9px;color:var(--taupe);margin-top:5px}
.main-nav{display:flex;align-items:center;justify-content:center;gap:6px;flex:1}
.main-nav a{
  padding:11px 13px;border-radius:999px;font-size:13px;font-weight:700;color:rgba(54,45,40,.78);
  transition:.2s ease;
}
.main-nav a:hover,.main-nav a.active{background:rgba(219,238,242,.78);color:var(--ink)}
.header-actions{display:flex;align-items:center;gap:8px;flex:0 0 auto}
.menu-toggle{display:none;border:0;background:var(--ink);color:white;border-radius:999px;width:42px;height:42px;font-size:19px}

.btn{
  border:0;border-radius:999px;padding:13px 18px;font-weight:800;font-size:13px;
  display:inline-flex;align-items:center;justify-content:center;gap:8px;transition:.22s ease;
  white-space:nowrap;
}
.btn-primary{background:var(--ink);color:white;box-shadow:0 16px 36px rgba(16,47,61,.22)}
.btn-primary:hover{transform:translateY(-2px);background:#0b2632;box-shadow:0 18px 42px rgba(16,47,61,.28)}
.btn-light{background:rgba(255,253,249,.86);color:var(--ink);border:1px solid rgba(199,168,108,.26)}
.btn-light:hover{background:white;transform:translateY(-2px)}
.btn-gold{background:linear-gradient(135deg,var(--champagne),#e5d3a9);color:#382f29;box-shadow:0 16px 36px rgba(199,168,108,.28)}
.btn-gold:hover{transform:translateY(-2px);filter:saturate(1.08)}
.btn-ghost{background:transparent;color:var(--ink);border:1px solid rgba(16,47,61,.18)}
.btn-ghost:hover{background:rgba(219,238,242,.62)}
.btn-danger{background:#fff2f0;color:var(--danger);border:1px solid rgba(167,79,79,.18)}
.btn-small{padding:9px 12px;font-size:12px}
.btn-full{width:100%}

main{min-height:70vh}
.section{width:min(calc(100% - 34px), var(--max));margin:0 auto;padding:70px 0}
.section.narrow{max-width:980px}
.hero{width:min(calc(100% - 34px), 1280px);margin:24px auto 0;padding:22px 0 70px}
.hero-layout{
  position:relative;overflow:hidden;border-radius:var(--radius-lg);
  min-height:640px;background:
    linear-gradient(145deg, rgba(255,253,249,.88) 0%, rgba(255,253,249,.78) 38%, rgba(219,238,242,.92) 100%);
  border:1px solid rgba(199,168,108,.28);
  box-shadow:var(--shadow);
  display:grid;grid-template-columns:1.02fr .98fr;align-items:stretch;
}
.hero-layout::before{
  content:"";position:absolute;inset:0;background:
    radial-gradient(circle at 28% 34%,rgba(255,255,255,.92),transparent 18rem),
    radial-gradient(circle at 75% 16%,rgba(234,219,211,.52),transparent 20rem),
    url('assets/flower-line.svg') right 3% top 12%/410px auto no-repeat;
  opacity:.9;pointer-events:none;
}
.hero-copy{position:relative;z-index:2;padding:84px 52px 52px;display:flex;flex-direction:column;justify-content:center}
.eyebrow{
  margin:0 0 18px;text-transform:uppercase;letter-spacing:.23em;color:var(--champagne);font-size:12px;font-weight:900;
}
.hero h1,.page-hero h1,.section-title h2{
  font-family:"Cormorant Garamond", Georgia, serif;color:var(--ink);font-weight:700;letter-spacing:-.045em;line-height:.88;margin:0;
}
.hero h1{font-size:clamp(58px,8vw,116px);max-width:640px}
.hero h1 span{font-style:italic;color:#567681;font-weight:600}
.lead{font-size:18px;line-height:1.78;color:rgba(54,45,40,.78);max-width:650px;margin:24px 0 0}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:34px}
.hero-signature{display:flex;gap:16px;align-items:center;margin-top:34px;color:var(--taupe);font-size:13px;line-height:1.6}
.hero-signature::before{content:"";display:block;width:62px;height:1px;background:var(--champagne)}
.hero-visual{position:relative;z-index:2;padding:40px 40px 40px 0;display:flex;align-items:center;justify-content:center}
.visual-frame{
  width:min(94%,520px);aspect-ratio:4/5;border-radius:46px;position:relative;overflow:hidden;background:var(--ink);box-shadow:0 34px 90px rgba(16,47,61,.26);
  border:1px solid rgba(255,255,255,.72);
}
.visual-frame::before{content:"POMSKY";position:absolute;left:-25px;top:18px;color:rgba(255,255,255,.16);font-size:88px;font-weight:900;letter-spacing:.16em;z-index:2;writing-mode:vertical-rl;line-height:1}
.visual-frame img{width:100%;height:100%;object-fit:cover;filter:saturate(.88) contrast(.98)}
.visual-card{
  position:absolute;z-index:4;background:rgba(255,253,249,.9);backdrop-filter:blur(14px);border:1px solid rgba(199,168,108,.25);border-radius:24px;padding:18px;box-shadow:0 18px 48px rgba(16,47,61,.16);
}
.visual-card.one{left:12px;bottom:76px;width:220px}
.visual-card.two{right:2px;top:92px;width:220px}
.visual-card strong{display:block;color:var(--ink);font-family:"Cormorant Garamond",serif;font-size:25px;line-height:1.05}
.visual-card small{display:block;margin-top:8px;color:var(--taupe);font-weight:700;font-size:11px;text-transform:uppercase;letter-spacing:.12em;line-height:1.45}
.hero-stats{position:absolute;left:52px;right:52px;bottom:34px;z-index:3;display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.stat-pill{background:rgba(255,253,249,.82);border:1px solid rgba(199,168,108,.2);border-radius:22px;padding:18px;box-shadow:0 14px 42px rgba(16,47,61,.09)}
.stat-pill strong{display:block;font-size:25px;color:var(--ink);font-weight:900;line-height:1}
.stat-pill span{display:block;color:var(--taupe);font-size:12px;margin-top:8px;font-weight:800}

.section-title{display:flex;align-items:end;justify-content:space-between;gap:22px;margin-bottom:30px}
.section-title h2{font-size:clamp(42px,6vw,76px)}
.section-title p{max-width:480px;line-height:1.75;color:rgba(54,45,40,.72);margin:0}

.grid{display:grid;gap:20px}
.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.card{
  background:rgba(255,253,249,.74);border:1px solid rgba(199,168,108,.18);border-radius:var(--radius);box-shadow:var(--shadow-soft);overflow:hidden;position:relative;
}
.card.pad{padding:28px}
.card.dark{background:linear-gradient(145deg,#102f3d,#163f50);color:#fff;border-color:rgba(255,255,255,.12)}
.card.dark p,.card.dark .muted{color:rgba(255,255,255,.72)}
.card.dark h3{color:white}
.card-soft{background:linear-gradient(145deg,rgba(219,238,242,.82),rgba(255,253,249,.80));border:1px solid rgba(199,168,108,.18);border-radius:var(--radius);padding:26px}
.card h3{font-family:"Cormorant Garamond",serif;font-size:33px;line-height:1;margin:0 0 12px;color:var(--ink)}
.card p{line-height:1.75;color:rgba(54,45,40,.72);margin:0}
.icon-badge{width:50px;height:50px;border-radius:18px;background:rgba(219,238,242,.75);display:grid;place-items:center;color:var(--ink);font-size:24px;margin-bottom:18px;border:1px solid rgba(199,168,108,.24)}

.editorial-band{background:linear-gradient(135deg,#102f3d,#173f4e);border-radius:46px;padding:50px;position:relative;overflow:hidden;color:white;box-shadow:var(--shadow)}
.editorial-band::before{content:"";position:absolute;inset:0;background:url('assets/flower-line.svg') right -40px top -60px/420px auto no-repeat;filter:invert(1);opacity:.12}
.editorial-band h2{font-family:"Cormorant Garamond",serif;font-size:clamp(42px,7vw,92px);line-height:.9;margin:0;letter-spacing:-.05em;color:white}
.editorial-band p{position:relative;z-index:2;max-width:700px;color:rgba(255,255,255,.75);line-height:1.8;font-size:17px}
.band-grid{position:relative;z-index:2;display:grid;grid-template-columns:1.2fr .8fr;gap:26px;align-items:end}

.photo-card{position:relative;overflow:hidden;border-radius:28px;background:white;box-shadow:var(--shadow-soft);border:1px solid rgba(199,168,108,.18)}
.photo-card img{width:100%;aspect-ratio:4/3;object-fit:cover;background:#e9f2f4}
.photo-card .content{padding:20px}
.photo-card h3{font-size:34px;margin:0 0 8px;letter-spacing:-.02em}
.meta{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0}
.badge{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:8px 11px;font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.06em;background:rgba(219,238,242,.72);color:var(--ink);border:1px solid rgba(16,47,61,.08)}
.badge.gold{background:#fbf2da;color:#6d5527;border-color:rgba(199,168,108,.24)}
.badge.ok{background:#edf6f1;color:var(--ok)}
.badge.warn{background:#fff4e8;color:var(--warning)}
.badge.danger{background:#fff0ed;color:var(--danger)}
.badge.dark{background:rgba(16,47,61,.08);color:var(--ink)}
.card-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.favorite{position:absolute;right:15px;top:15px;border:0;background:rgba(255,253,249,.86);backdrop-filter:blur(12px);width:44px;height:44px;border-radius:50%;display:grid;place-items:center;font-size:19px;color:#b66767;box-shadow:0 12px 28px rgba(16,47,61,.12)}
.favorite.active{background:#fff0f0;color:#c34747}

.page-hero{width:min(calc(100% - 34px),var(--max));margin:36px auto 0;border-radius:var(--radius-lg);padding:64px 48px;background:linear-gradient(135deg,rgba(255,253,249,.86),rgba(219,238,242,.66));border:1px solid rgba(199,168,108,.22);box-shadow:var(--shadow-soft);position:relative;overflow:hidden}
.page-hero::after{content:"";position:absolute;right:-80px;top:-80px;width:360px;height:360px;background:url('assets/flower-line.svg') center/contain no-repeat;opacity:.45;pointer-events:none}
.page-hero h1{font-size:clamp(52px,8vw,96px);position:relative;z-index:2}
.page-hero p{position:relative;z-index:2;max-width:720px;font-size:18px;line-height:1.8;color:rgba(54,45,40,.74)}

.filters{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:22px}
.filter-btn{border:1px solid rgba(16,47,61,.12);background:rgba(255,253,249,.76);padding:12px 16px;border-radius:999px;color:var(--ink);font-weight:900}
.filter-btn.active{background:var(--ink);color:white}

.timeline{display:grid;gap:18px;counter-reset:step}
.timeline-item{display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:start;background:rgba(255,253,249,.72);border:1px solid rgba(199,168,108,.18);border-radius:26px;padding:22px}
.timeline-item::before{counter-increment:step;content:counter(step);width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:var(--ink);color:white;font-weight:900;box-shadow:0 15px 26px rgba(16,47,61,.18)}
.timeline-item h3{margin:0 0 8px;font-size:20px;color:var(--ink)}
.timeline-item p{margin:0;line-height:1.65;color:rgba(54,45,40,.72)}

.form{display:grid;gap:14px}
.form-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
label{display:grid;gap:7px;font-size:12px;font-weight:900;color:var(--ink);text-transform:uppercase;letter-spacing:.06em}
input,textarea,select{
  border:1px solid rgba(16,47,61,.14);background:rgba(255,253,249,.86);border-radius:16px;padding:13px 14px;color:var(--brown);outline:none;transition:.18s ease;width:100%;
}
textarea{min-height:120px;resize:vertical}
input:focus,textarea:focus,select:focus{border-color:rgba(199,168,108,.75);box-shadow:0 0 0 4px rgba(199,168,108,.12)}

.auth-layout{display:grid;grid-template-columns:.9fr 1.1fr;gap:26px;align-items:stretch}
.login-card{padding:28px}
.demo-ids{background:rgba(16,47,61,.06);border-radius:22px;padding:18px;color:rgba(54,45,40,.78);line-height:1.7;font-size:13px;margin-top:18px}

.dashboard{display:grid;grid-template-columns:280px 1fr;gap:22px;align-items:start}
.side-panel{position:sticky;top:104px;padding:18px}
.side-panel h3{font-size:28px;margin-bottom:14px}
.tab-btn{width:100%;border:0;background:transparent;text-align:left;padding:13px 14px;border-radius:16px;font-weight:900;color:rgba(54,45,40,.68);display:flex;justify-content:space-between;gap:10px}
.tab-btn:hover,.tab-btn.active{background:rgba(219,238,242,.74);color:var(--ink)}
.tab-content{display:none}
.tab-content.active{display:block;animation:rise .28s ease both}
@keyframes rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.table-wrap{overflow:auto;border-radius:24px;border:1px solid rgba(199,168,108,.18);background:rgba(255,253,249,.72)}
table{width:100%;border-collapse:collapse;min-width:760px}
th,td{padding:14px 16px;border-bottom:1px solid rgba(16,47,61,.08);text-align:left;font-size:13px;vertical-align:middle}
th{color:var(--ink);font-size:11px;text-transform:uppercase;letter-spacing:.09em;background:rgba(219,238,242,.42)}
tr:last-child td{border-bottom:0}
.actions-cell{display:flex;gap:8px;flex-wrap:wrap}
.empty{padding:26px;border-radius:24px;background:rgba(255,253,249,.68);border:1px dashed rgba(16,47,61,.16);color:var(--taupe);line-height:1.7;text-align:center}

.detail-layout{display:grid;grid-template-columns:1.02fr .98fr;gap:26px;align-items:start}
.detail-media{position:sticky;top:104px;border-radius:38px;overflow:hidden;box-shadow:var(--shadow);background:white;border:1px solid rgba(199,168,108,.18)}
.detail-media img{width:100%;aspect-ratio:4/4.65;object-fit:cover}
.detail-panel{padding:34px}
.detail-panel h1{font-family:"Cormorant Garamond",serif;font-size:72px;line-height:.9;color:var(--ink);letter-spacing:-.04em;margin:0 0 18px}
.spec-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:22px 0}
.spec{background:rgba(219,238,242,.48);border-radius:18px;padding:14px;border:1px solid rgba(16,47,61,.06)}
.spec small{display:block;text-transform:uppercase;letter-spacing:.08em;font-weight:900;color:var(--taupe);font-size:10px;margin-bottom:5px}
.spec strong{color:var(--ink);font-size:16px}

.modal{position:fixed;inset:0;background:rgba(9,28,36,.58);backdrop-filter:blur(10px);z-index:100;display:none;align-items:center;justify-content:center;padding:18px}
.modal.open{display:flex}
.modal-box{width:min(760px,100%);max-height:90vh;overflow:auto;background:var(--cream-2);border-radius:30px;box-shadow:0 34px 100px rgba(0,0,0,.28);border:1px solid rgba(255,255,255,.7)}
.modal-head{display:flex;justify-content:space-between;gap:18px;align-items:center;padding:22px 24px;border-bottom:1px solid rgba(16,47,61,.08)}
.modal-head h3{font-family:"Cormorant Garamond",serif;font-size:35px;margin:0;color:var(--ink)}
.modal-body{padding:24px}
.close-modal{border:0;background:rgba(16,47,61,.08);border-radius:50%;width:42px;height:42px;color:var(--ink);font-size:20px}
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(20px);background:var(--ink);color:white;padding:14px 18px;border-radius:999px;box-shadow:0 18px 54px rgba(16,47,61,.35);z-index:120;opacity:0;pointer-events:none;transition:.25s ease;font-weight:800;font-size:13px}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

.chat-box{display:grid;gap:12px;max-height:420px;overflow:auto;padding:6px}
.message{padding:13px 15px;border-radius:18px;background:rgba(219,238,242,.62);max-width:75%;line-height:1.5;font-size:14px}
.message.mine{margin-left:auto;background:var(--ink);color:white}
.message small{display:block;margin-top:7px;opacity:.7;font-size:10px;text-transform:uppercase;letter-spacing:.06em;font-weight:900}

.site-footer{width:min(calc(100% - 34px),1280px);margin:40px auto 20px;background:var(--ink);color:white;border-radius:42px;padding:36px;box-shadow:var(--shadow);overflow:hidden;position:relative}
.site-footer::after{content:"";position:absolute;right:-70px;bottom:-90px;width:370px;height:370px;background:url('assets/flower-line.svg') center/contain no-repeat;filter:invert(1);opacity:.11}
.footer-inner{position:relative;z-index:1;display:grid;grid-template-columns:1.1fr .9fr;gap:28px;align-items:start}
.site-footer h3{font-family:"Cormorant Garamond",serif;font-size:42px;line-height:1;margin:0;max-width:560px}
.footer-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.footer-grid a{padding:14px 16px;border-radius:18px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.09);font-weight:800;color:rgba(255,255,255,.82)}
.footer-note{position:relative;z-index:1;color:rgba(255,255,255,.58);font-size:12px;margin:28px 0 0}

@media (max-width:1050px){
  .site-header{border-radius:28px;align-items:flex-start;flex-wrap:wrap}.menu-toggle{display:grid;place-items:center;margin-left:auto}.brand{min-width:auto}.main-nav{display:none;flex-basis:100%;order:4;flex-direction:column;align-items:stretch;background:rgba(255,253,249,.7);padding:10px;border-radius:22px}.main-nav.open{display:flex}.main-nav a{padding:14px 16px}.header-actions{margin-left:auto}.hero-layout{grid-template-columns:1fr;min-height:auto}.hero-copy{padding:62px 32px 34px}.hero-visual{padding:0 32px 44px}.hero-stats{left:28px;right:28px;grid-template-columns:repeat(2,1fr)}.visual-card.one{left:30px}.visual-card.two{right:26px}.grid-4{grid-template-columns:repeat(2,1fr)}.grid-3{grid-template-columns:repeat(2,1fr)}.auth-layout,.dashboard,.detail-layout,.band-grid{grid-template-columns:1fr}.side-panel,.detail-media{position:relative;top:auto}.side-panel{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.side-panel h3{grid-column:1/-1}.tab-btn{font-size:13px}.footer-inner{grid-template-columns:1fr}
}
@media (max-width:640px){
  .site-header{width:calc(100% - 18px);margin-top:9px;padding:10px}.brand img{width:43px;height:43px}.brand strong{font-size:19px}.header-actions .btn-light{display:none}.hero{width:calc(100% - 18px);padding-bottom:34px}.hero-layout{border-radius:30px}.hero-copy{padding:46px 22px 28px}.hero h1{font-size:58px}.lead{font-size:15px;line-height:1.7}.hero-actions{flex-direction:column}.btn{width:100%}.hero-visual{padding:0 18px 28px}.visual-frame{width:100%;border-radius:32px}.visual-frame::before{font-size:54px}.visual-card{display:none}.hero-stats{grid-template-columns:1fr;bottom:20px;gap:8px}.stat-pill{padding:13px 16px;border-radius:18px}.stat-pill strong{font-size:21px}.section{width:calc(100% - 24px);padding:42px 0}.section-title{display:block}.section-title h2{font-size:45px}.section-title p{margin-top:14px}.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}.page-hero{width:calc(100% - 24px);padding:42px 24px;border-radius:30px}.page-hero h1{font-size:52px}.editorial-band{border-radius:30px;padding:30px}.form-row{grid-template-columns:1fr}.side-panel{grid-template-columns:1fr}.detail-panel{padding:24px}.detail-panel h1{font-size:54px}.spec-grid{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr}.site-footer{width:calc(100% - 24px);border-radius:30px;padding:28px}.site-footer h3{font-size:32px}.toast{width:calc(100% - 24px);text-align:center;border-radius:22px}
}

/* =========================================================
   V4 — Design 3D futuriste, élégant et fleuri
   Palette inspirée du logo : bleu poudré, crème, beige, champagne,
   avec bleu nuit en accent premium.
   ========================================================= */
:root{
  --ink:#0a2d3b;
  --ink-2:#123f51;
  --ink-soft:#416b78;
  --powder:#d8edf3;
  --powder-2:#eef8fa;
  --cream:#fffaf2;
  --cream-2:#fffefb;
  --sand:#dfc9ad;
  --sand-2:#f1e2ce;
  --champagne:#d3b36f;
  --champagne-2:#f1dbac;
  --taupe:#8b7a6b;
  --brown:#2f2925;
  --rose:#f3dfda;
  --green:#d4dfd8;
  --lavender:#ece8ff;
  --glow-blue:0 0 70px rgba(216,237,243,.95);
  --glow-gold:0 0 60px rgba(211,179,111,.36);
  --shadow:0 35px 100px rgba(10,45,59,.16);
  --shadow-soft:0 22px 60px rgba(10,45,59,.11);
  --radius:34px;
  --radius-lg:54px;
}

html{background:#fffaf2}
body{
  background:
    radial-gradient(circle at 8% 5%, rgba(216,237,243,.92), transparent 32rem),
    radial-gradient(circle at 86% 8%, rgba(243,223,218,.72), transparent 34rem),
    radial-gradient(circle at 15% 82%, rgba(211,179,111,.20), transparent 28rem),
    linear-gradient(180deg,#fffefb 0%,#fffaf2 42%,#f8eddf 100%);
  color:var(--brown);
}
body::before{
  content:"";
  position:fixed;
  inset:-20%;
  z-index:0;
  pointer-events:none;
  opacity:.55;
  background:
    linear-gradient(115deg, transparent 0 38%, rgba(216,237,243,.45) 38% 40%, transparent 40% 100%),
    linear-gradient(245deg, transparent 0 46%, rgba(211,179,111,.14) 46% 48%, transparent 48% 100%);
  transform:translate3d(calc(var(--mx,0)*22px), calc(var(--my,0)*22px), 0);
}
.grain{opacity:.18;mix-blend-mode:multiply}
.app-shell{position:relative;z-index:2}

.ambient-layer{position:fixed;inset:0;z-index:1;pointer-events:none;overflow:hidden}
.ambient{
  position:absolute;
  display:grid;
  place-items:center;
  width:74px;height:74px;
  border-radius:28px;
  background:linear-gradient(145deg, rgba(255,254,251,.82), rgba(216,237,243,.48));
  border:1px solid rgba(255,255,255,.72);
  box-shadow:18px 26px 60px rgba(10,45,59,.10), inset -10px -14px 24px rgba(10,45,59,.05), inset 10px 12px 20px rgba(255,255,255,.75);
  font-size:25px;
  color:rgba(10,45,59,.55);
  filter:saturate(.9);
  animation:ambientFloat 8s ease-in-out infinite;
}
.ambient-paw{left:3%;top:18%;transform:rotate(-12deg);animation-delay:-1s}
.ambient-bone{right:5%;top:25%;transform:rotate(16deg);animation-delay:-3s}
.ambient-toy{left:7%;bottom:16%;transform:rotate(8deg);animation-delay:-5s}
.ambient-flower{right:8%;bottom:19%;transform:rotate(-10deg);animation-delay:-2s;color:rgba(139,122,107,.48)}
.ambient-ball{left:47%;top:6%;width:54px;height:54px;border-radius:50%;animation-delay:-4s;font-size:20px}
@keyframes ambientFloat{0%,100%{translate:0 0;rotate:0deg}50%{translate:0 -22px;rotate:5deg}}

.site-header{
  top:18px;
  padding:12px 14px;
  background:linear-gradient(135deg,rgba(255,254,251,.78),rgba(238,248,250,.68));
  border:1px solid rgba(255,255,255,.72);
  box-shadow:0 22px 70px rgba(10,45,59,.12), inset 0 0 0 1px rgba(211,179,111,.12);
  backdrop-filter:blur(26px) saturate(1.3);
}
.brand img{
  width:52px;height:52px;
  border-radius:20px;
  box-shadow:0 18px 38px rgba(10,45,59,.18),0 0 0 6px rgba(216,237,243,.36);
}
.brand strong{font-size:24px;letter-spacing:-.025em}
.main-nav a{position:relative;color:rgba(47,41,37,.72)}
.main-nav a::after{
  content:"";position:absolute;left:50%;bottom:5px;width:0;height:2px;border-radius:999px;background:linear-gradient(90deg,var(--champagne),var(--powder));transition:.22s ease;transform:translateX(-50%);
}
.main-nav a:hover,.main-nav a.active{background:rgba(255,255,255,.64);box-shadow:inset 0 0 0 1px rgba(216,237,243,.75)}
.main-nav a:hover::after,.main-nav a.active::after{width:36%}

.btn{position:relative;overflow:hidden;box-shadow:none;isolation:isolate}
.btn::before{
  content:"";position:absolute;inset:-2px;z-index:-1;background:linear-gradient(120deg,transparent,rgba(255,255,255,.42),transparent);transform:translateX(-120%);transition:.5s ease;
}
.btn:hover::before{transform:translateX(120%)}
.btn-primary{
  background:linear-gradient(135deg,#062936,#123f51 64%,#1d5d71);
  box-shadow:0 18px 42px rgba(10,45,59,.24), inset 0 1px 0 rgba(255,255,255,.18);
}
.btn-gold{
  background:linear-gradient(135deg,#d4b16d,#f1dbac 55%,#c8a45e);
  color:#2f2925;
  box-shadow:0 18px 46px rgba(211,179,111,.28), inset 0 1px 0 rgba(255,255,255,.42);
}
.btn-ghost,.btn-light{
  background:rgba(255,254,251,.62);
  border:1px solid rgba(10,45,59,.12);
  backdrop-filter:blur(14px);
}

.future-hero{width:min(calc(100% - 34px),1320px);padding-bottom:54px}
.hero-futuristic{
  min-height:720px;
  overflow:hidden;
  border-radius:58px;
  background:
    radial-gradient(circle at 72% 31%, rgba(216,237,243,.94), transparent 24rem),
    radial-gradient(circle at 42% 80%, rgba(211,179,111,.22), transparent 26rem),
    linear-gradient(138deg, rgba(255,254,251,.92) 0%, rgba(255,250,242,.82) 44%, rgba(236,248,250,.86) 100%);
  border:1px solid rgba(255,255,255,.82);
  box-shadow:0 45px 130px rgba(10,45,59,.15), inset 0 1px 0 rgba(255,255,255,.85);
}
.hero-futuristic::before{
  content:"";
  opacity:1;
  background:
    url('assets/flower-line.svg') right 1% top 8%/430px auto no-repeat,
    radial-gradient(circle at 16% 22%, rgba(255,255,255,.88), transparent 20rem),
    linear-gradient(90deg, transparent 0 45%, rgba(255,255,255,.24) 45% 46%, transparent 46% 100%);
}
.hero-futuristic::after{
  content:"";position:absolute;right:-9%;bottom:-25%;width:58%;aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle,rgba(216,237,243,.48),rgba(255,255,255,.12) 45%,transparent 68%);
  filter:blur(2px);pointer-events:none;
}
.hero-copy{padding:92px 56px 64px;transform:translate3d(calc(var(--mx,0)*-10px),calc(var(--my,0)*-8px),0)}
.hero h1{
  font-size:clamp(56px,7.2vw,112px);
  text-wrap:balance;
  filter:drop-shadow(0 18px 38px rgba(10,45,59,.08));
}
.hero h1 span{
  background:linear-gradient(120deg,#0a2d3b,#487887 55%,#c4a15e);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  font-style:italic;
}
.lead{max-width:690px;color:rgba(47,41,37,.76);font-size:18px;line-height:1.85}
.trust-strip{
  margin-top:26px;
  display:flex;flex-wrap:wrap;gap:10px;
}
.trust-strip span{
  display:inline-flex;align-items:center;gap:8px;
  padding:10px 14px;border-radius:999px;
  background:rgba(255,254,251,.62);
  border:1px solid rgba(216,237,243,.85);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 10px 26px rgba(10,45,59,.06);
  color:var(--ink);font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:.08em;
}
.trust-strip span::before{content:"✦";color:var(--champagne)}
.hero-signature{
  border-left:0;
  padding:16px 20px;
  border-radius:24px;
  background:linear-gradient(135deg,rgba(255,254,251,.62),rgba(216,237,243,.34));
  border:1px solid rgba(255,255,255,.72);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.78);
}
.hero-signature::before{display:none}
.hero-orbits{position:absolute;inset:0;pointer-events:none;z-index:4}
.floating-object{
  position:absolute;display:grid;place-items:center;width:76px;height:76px;border-radius:26px;
  background:linear-gradient(145deg,rgba(255,254,251,.84),rgba(216,237,243,.46));
  box-shadow:18px 24px 56px rgba(10,45,59,.12), inset 10px 14px 22px rgba(255,255,255,.75), inset -10px -12px 24px rgba(10,45,59,.06);
  border:1px solid rgba(255,255,255,.78);
  font-size:26px;
  animation:float3d 7s ease-in-out infinite;
}
.floating-object.paw{left:46%;top:10%;animation-delay:-2s;rotate:-12deg}
.floating-object.bone{right:4%;top:44%;animation-delay:-4s;rotate:12deg}
.floating-object.ball{left:36%;bottom:13%;width:58px;height:58px;border-radius:50%;animation-delay:-1s;font-size:20px}
.floating-object.flower{left:5%;top:59%;animation-delay:-6s;color:rgba(139,122,107,.58)}
.floating-object.star{right:40%;bottom:6%;width:54px;height:54px;border-radius:20px;animation-delay:-3s;color:var(--champagne)}
@keyframes float3d{0%,100%{transform:translate3d(0,0,0) rotateX(0deg)}50%{transform:translate3d(0,-24px,16px) rotateX(10deg)}}

.hero-visual{padding:44px 50px 44px 0;transform:translate3d(calc(var(--mx,0)*16px),calc(var(--my,0)*12px),0)}
.visual-halo{
  position:absolute;z-index:1;width:min(82%,620px);aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle,rgba(255,255,255,.92),rgba(216,237,243,.45) 42%,rgba(211,179,111,.12) 62%,transparent 70%);
  filter:blur(4px);animation:pulseHalo 4.5s ease-in-out infinite;
}
@keyframes pulseHalo{0%,100%{scale:1;opacity:.9}50%{scale:1.05;opacity:.72}}
.futuristic-frame{
  z-index:3;
  width:min(94%,540px);
  aspect-ratio:1;
  border-radius:48px;
  background:linear-gradient(145deg,#092c3a,#d8edf3);
  box-shadow:
    0 40px 120px rgba(10,45,59,.28),
    0 0 0 14px rgba(255,254,251,.35),
    inset 0 1px 0 rgba(255,255,255,.82);
  transform:perspective(1200px) rotateY(-5deg) rotateX(4deg);
}
.futuristic-frame::before{
  content:"MY LITTLE";
  left:30px;top:26px;
  writing-mode:horizontal-tb;
  font-size:15px;letter-spacing:.42em;color:rgba(255,255,255,.68);
}
.futuristic-frame::after{
  content:"";position:absolute;inset:18px;border-radius:34px;border:1px solid rgba(255,255,255,.48);pointer-events:none;
}
.futuristic-frame img{filter:saturate(.96) contrast(1.02);transform:scale(1.03)}
.glass-chip{
  background:linear-gradient(145deg,rgba(255,254,251,.86),rgba(238,248,250,.66));
  backdrop-filter:blur(22px) saturate(1.25);
  border:1px solid rgba(255,255,255,.82);
  box-shadow:0 24px 68px rgba(10,45,59,.16),inset 0 1px 0 rgba(255,255,255,.84);
}
.visual-card.one{left:-12px;bottom:96px}
.visual-card.two{right:-4px;top:108px}
.visual-card strong{font-size:29px}
.mini-orb{
  position:absolute;z-index:5;display:grid;place-items:center;
  width:54px;height:54px;border-radius:20px;background:linear-gradient(145deg,#fffefb,#e7f5f7);
  border:1px solid rgba(255,255,255,.8);box-shadow:0 18px 40px rgba(10,45,59,.14),inset -8px -10px 16px rgba(10,45,59,.04),inset 8px 8px 16px rgba(255,255,255,.72);
  animation:float3d 6s ease-in-out infinite;font-size:20px;
}
.orb-a{left:12%;top:13%;animation-delay:-2s}.orb-b{right:7%;bottom:18%;animation-delay:-4s}.orb-c{left:8%;bottom:34%;animation-delay:-1s;color:var(--taupe)}

.section{position:relative;z-index:3}
.section-title h2,.page-hero h1{letter-spacing:-.05em;text-wrap:balance}
.section-title p{font-size:16px;line-height:1.75;color:rgba(47,41,37,.68)}
.intro-panel::before{
  content:"";position:absolute;left:50%;top:44px;translate:-50% 0;width:min(100%,1120px);height:260px;border-radius:58px;
  background:linear-gradient(135deg,rgba(216,237,243,.32),rgba(255,254,251,.1),rgba(211,179,111,.11));
  z-index:-1;filter:blur(.2px);
}

.card,.photo-card,.editorial-band,.page-hero,.login-card,.side-panel,.detail-panel{
  border:1px solid rgba(255,255,255,.78)!important;
  background:linear-gradient(145deg,rgba(255,254,251,.78),rgba(255,250,242,.58) 45%,rgba(238,248,250,.52));
  backdrop-filter:blur(20px) saturate(1.22);
  box-shadow:0 24px 70px rgba(10,45,59,.10),inset 0 1px 0 rgba(255,255,255,.9);
}
.card,.photo-card{transition:transform .24s ease, box-shadow .24s ease, border-color .24s ease}
.card:hover,.photo-card:hover{
  transform:translateY(-8px);
  box-shadow:0 32px 90px rgba(10,45,59,.16),0 0 0 1px rgba(216,237,243,.35),inset 0 1px 0 rgba(255,255,255,.95);
}
.card.dark,.login-card.dark{
  background:linear-gradient(145deg,#0a2d3b,#123f51 62%,#1f5a6b);
  border-color:rgba(255,255,255,.2)!important;
  box-shadow:0 34px 90px rgba(10,45,59,.24),inset 0 1px 0 rgba(255,255,255,.18);
}
.card.dark p,.card.dark h3,.login-card.dark p,.login-card.dark h3{color:white}
.card.dark .eyebrow,.login-card.dark .eyebrow{color:var(--champagne-2)}
.icon-badge{
  width:58px;height:58px;border-radius:22px;
  display:grid;place-items:center;
  background:linear-gradient(145deg,#fffefb,#e9f6f8);
  box-shadow:0 16px 34px rgba(10,45,59,.11),inset -8px -10px 16px rgba(10,45,59,.04),inset 8px 8px 15px rgba(255,255,255,.8);
  border:1px solid rgba(255,255,255,.78);
  font-size:24px;
}
.photo-card{overflow:hidden;border-radius:34px;position:relative}
.photo-card::after{
  content:"";position:absolute;inset:auto 22px 22px auto;width:64px;height:64px;border-radius:24px;
  background:linear-gradient(145deg,rgba(216,237,243,.48),rgba(255,254,251,.52));
  box-shadow:inset 8px 8px 18px rgba(255,255,255,.62),inset -8px -10px 18px rgba(10,45,59,.04);
  opacity:.75;pointer-events:none;
}
.photo-card img{border-radius:0 0 30px 30px;height:270px;object-fit:cover;background:linear-gradient(135deg,#eaf6f8,#fffaf2)}
.photo-card .content{position:relative;z-index:2;background:linear-gradient(180deg,rgba(255,254,251,.8),rgba(255,250,242,.58))}
.badge{
  background:rgba(216,237,243,.72);
  border:1px solid rgba(255,255,255,.72);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8);
}
.badge.dark{background:rgba(10,45,59,.08);color:var(--ink)}

.futuristic-band{
  position:relative;overflow:hidden;border-radius:54px;
  background:
    radial-gradient(circle at 70% 46%,rgba(216,237,243,.58),transparent 17rem),
    linear-gradient(135deg,#0a2d3b,#143f50 58%,#1b6274);
  color:white;
}
.futuristic-band::before{
  content:"";position:absolute;right:-8%;top:-35%;width:420px;aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle,rgba(255,255,255,.16),transparent 70%);
}
.futuristic-band h2,.futuristic-band p{color:white!important}
.futuristic-band .eyebrow{color:var(--champagne-2)}
.band-floating{display:flex;gap:14px;align-items:center;justify-content:center;flex-wrap:wrap}
.band-floating span{display:grid;place-items:center;width:66px;height:66px;border-radius:24px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);box-shadow:inset 0 1px 0 rgba(255,255,255,.22);font-size:24px;animation:float3d 6s ease-in-out infinite}
.band-floating span:nth-child(2){animation-delay:-2s}.band-floating span:nth-child(3){animation-delay:-4s}

.page-hero{
  position:relative;overflow:hidden;
  background:
    url('assets/flower-line.svg') right 4% center/300px auto no-repeat,
    radial-gradient(circle at 75% 20%,rgba(216,237,243,.74),transparent 20rem),
    linear-gradient(135deg,rgba(255,254,251,.86),rgba(255,250,242,.74));
}
.page-hero::after{
  content:"🐾";position:absolute;right:42px;bottom:26px;width:70px;height:70px;display:grid;place-items:center;border-radius:26px;
  background:linear-gradient(145deg,rgba(255,254,251,.82),rgba(216,237,243,.4));font-size:24px;box-shadow:0 18px 45px rgba(10,45,59,.09);
}

.form input,.form textarea,.form select,input,textarea,select{
  background:rgba(255,254,251,.78)!important;
  border:1px solid rgba(10,45,59,.14)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.76);
}
.form input:focus,.form textarea:focus,.form select:focus,input:focus,textarea:focus,select:focus{outline:2px solid rgba(216,237,243,.96);border-color:rgba(10,45,59,.22)!important}
.table-wrap table{background:rgba(255,254,251,.54);border-radius:24px;overflow:hidden}
th{background:rgba(216,237,243,.42);color:var(--ink)}
.chat-box{background:linear-gradient(145deg,rgba(255,254,251,.65),rgba(238,248,250,.45));border-radius:24px}
.message{border-radius:20px;background:rgba(255,254,251,.75);box-shadow:0 12px 28px rgba(10,45,59,.06)}
.message.mine{background:linear-gradient(135deg,rgba(216,237,243,.72),rgba(255,254,251,.7))}
.modal-box{background:linear-gradient(145deg,rgba(255,254,251,.95),rgba(238,248,250,.88));border:1px solid rgba(255,255,255,.82);box-shadow:0 50px 120px rgba(10,45,59,.24)}

.site-footer{
  position:relative;z-index:3;
  background:linear-gradient(135deg,#0a2d3b,#123f51 58%,#1a5b6d);
  color:white;
  border-top:1px solid rgba(255,255,255,.12);
  box-shadow:0 -30px 80px rgba(10,45,59,.12);
}
.site-footer h3,.site-footer a,.footer-note{color:white!important}.site-footer .eyebrow{color:var(--champagne-2)}

@media (max-width: 980px){
  .ambient{opacity:.52;scale:.78}
  .hero-futuristic{grid-template-columns:1fr;min-height:auto}
  .hero-copy{padding:64px 28px 28px}
  .hero-visual{padding:18px 24px 56px;min-height:520px}
  .visual-card.one{left:18px;bottom:64px}.visual-card.two{right:18px;top:40px}
  .floating-object.paw{left:76%;top:11%}.floating-object.bone{right:6%;top:52%}.floating-object.flower{left:2%;top:46%}
  .trust-strip span{font-size:11px}
}
@media (max-width: 720px){
  .site-header{border-radius:28px;align-items:flex-start;flex-wrap:wrap}
  .brand{min-width:0;flex:1}.brand strong{font-size:21px}.brand img{width:46px;height:46px;border-radius:17px}
  .header-actions{width:100%;justify-content:flex-start;flex-wrap:wrap}.menu-toggle{display:grid;place-items:center}
  .main-nav{display:none;width:100%;order:5;flex-direction:column;align-items:stretch;background:rgba(255,254,251,.82);border-radius:22px;padding:8px}.main-nav.open{display:flex}.main-nav a{text-align:center}
  .hero{width:min(calc(100% - 20px),1320px);margin-top:12px}
  .hero-futuristic{border-radius:34px}
  .hero h1{font-size:clamp(46px,16vw,74px)}
  .lead{font-size:16px;line-height:1.7}
  .hero-actions{flex-direction:column}.hero-actions .btn{width:100%}
  .visual-card{width:184px;padding:14px}.visual-card strong{font-size:24px}.visual-card small{font-size:10px}
  .futuristic-frame{width:min(92%,420px);border-radius:38px}
  .floating-object{width:58px;height:58px;border-radius:21px;font-size:20px}.mini-orb{display:none}
  .section{width:min(calc(100% - 22px),var(--max));padding:48px 0}.section-title{gap:18px}
  .page-hero{border-radius:34px;padding:48px 24px}.page-hero h1{font-size:44px}.page-hero::after{display:none}
}


/* ===== Profil adoptant : correctifs affichage + mobile ===== */
.profile-card{overflow:hidden}
.profile-header{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(280px,.9fr);gap:22px;align-items:start;margin-bottom:24px}
.profile-header-main h3{margin:0;font-size:clamp(34px,4.2vw,56px);letter-spacing:-.04em;color:var(--ink);line-height:1.05;text-wrap:balance}
.profile-header .eyebrow{margin:0 0 10px}
.profile-header-text{margin:6px 0 0;color:rgba(47,41,37,.72);line-height:1.75;font-size:16px;max-width:520px}
.profile-form{gap:16px}
.profile-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.field-full{grid-column:1 / -1}
.profile-check-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:start}
.checkline.profile-checkline{display:flex;align-items:center;gap:12px;min-height:60px;padding:16px 18px;border:1px solid rgba(10,45,59,.12);border-radius:18px;background:rgba(255,254,251,.72);box-shadow:inset 0 1px 0 rgba(255,255,255,.72);font-size:13px;line-height:1.35;text-transform:uppercase;letter-spacing:.05em;color:var(--ink)}
.checkline.profile-checkline span{display:block;font-weight:900}
.checkline.profile-checkline input[type="checkbox"]{width:22px!important;height:22px!important;min-width:22px;flex:0 0 22px;margin:0;padding:0;border-radius:6px;accent-color:#0f4c63;box-shadow:none!important;background:none!important}
.profile-check-grid > label:not(.checkline){display:grid;gap:7px}
.profile-form textarea{min-height:118px}
.profile-submit{margin-top:4px}

@media (max-width: 900px){
  .profile-header{grid-template-columns:1fr;gap:12px}
  .profile-header-text{max-width:none;margin-top:0}
  .profile-check-grid{grid-template-columns:1fr}
}

@media (max-width: 720px){
  .profile-card{padding:20px!important;border-radius:28px}
  .profile-header-main h3{font-size:clamp(28px,8.5vw,40px)}
  .profile-header-text{font-size:15px;line-height:1.65}
  .profile-row{grid-template-columns:1fr;gap:14px}
  .profile-check-grid{gap:14px}
  .checkline.profile-checkline{min-height:56px;padding:14px 16px;border-radius:16px}
  .profile-form{gap:14px}
  .profile-form input,.profile-form select,.profile-form textarea{font-size:16px}
  .profile-submit{width:100%;border-radius:18px;padding:15px 18px}
}

@media (max-width: 420px){
  .profile-card{padding:18px!important}
  .profile-header-main h3{font-size:30px}
}


/* ===== Questionnaire d’adoption complet ===== */
.adoption-questionnaire{gap:16px}
.questionnaire-intro{
  border:1px solid rgba(10,45,59,.10);
  border-radius:24px;
  padding:18px 20px;
  background:linear-gradient(145deg,rgba(255,254,251,.82),rgba(216,237,243,.35));
}
.questionnaire-intro h3{margin:0 0 8px;color:var(--ink);font-size:clamp(26px,3vw,38px);letter-spacing:-.035em}
.questionnaire-intro p:last-child{margin:0;color:rgba(47,41,37,.72);line-height:1.65}
.questionnaire-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.questionnaire-consent{
  display:flex!important;
  align-items:flex-start;
  gap:12px;
  padding:16px 18px;
  border:1px solid rgba(199,168,108,.22);
  border-radius:18px;
  background:rgba(255,254,251,.78);
  line-height:1.45;
}
.questionnaire-consent input[type="checkbox"]{
  width:22px!important;
  height:22px!important;
  min-width:22px;
  margin:0;
  padding:0;
  accent-color:#0f4c63;
  box-shadow:none!important;
}
.questionnaire-consent span{text-transform:none;letter-spacing:0;font-weight:800;color:rgba(47,41,37,.78)}
.application-detail-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:18px}
.application-detail-head h3{margin:0;color:var(--ink);font-size:clamp(30px,4vw,48px);letter-spacing:-.04em}
.questionnaire-read{
  margin-top:18px;
  padding:18px 20px;
  border-radius:22px;
  border:1px solid rgba(10,45,59,.10);
  background:rgba(255,254,251,.76);
  color:rgba(47,41,37,.86);
  line-height:1.75;
  white-space:normal;
}

@media (max-width: 720px){
  .questionnaire-row{grid-template-columns:1fr}
  .adoption-questionnaire textarea{min-height:110px}
  .questionnaire-intro{padding:16px;border-radius:20px}
  .questionnaire-consent{padding:14px 16px}
  .application-detail-head{display:block}
  .application-detail-head .badge{margin-top:10px}
}


/* ===== Questionnaire simplifié ===== */
.simple-questionnaire .questionnaire-intro{margin-bottom:2px}
.simple-questionnaire textarea{min-height:95px}
.simple-questionnaire select{cursor:pointer}
@media (max-width:720px){
  .simple-questionnaire .questionnaire-intro h3{font-size:28px}
  .simple-questionnaire textarea{min-height:92px}
}


/* =========================================================
   Correctif messagerie - restaurer les bulles foncees lisibles
   ========================================================= */
.chat-box{
  padding:18px !important;
  gap:14px !important;
}

.message{
  background:rgba(255,254,251,.88) !important;
  color:#173546 !important;
  border:1px solid rgba(216,198,179,.55) !important;
  box-shadow:0 14px 32px rgba(10,45,59,.08) !important;
}

.message.mine{
  margin-left:auto !important;
  background:linear-gradient(135deg,#0a3546 0%,#11536b 52%,#1a6a84 100%) !important;
  color:#ffffff !important;
  border:1px solid rgba(255,255,255,.28) !important;
  box-shadow:0 18px 38px rgba(10,45,59,.22) !important;
}

.message small{
  opacity:.78 !important;
}

.message.mine small{
  color:rgba(255,255,255,.84) !important;
  opacity:1 !important;
}


/* =========================================================
   Chiots + portées : liaison famille maman/papa
   ========================================================= */
.family-line{
  margin:10px 0 12px;
  padding:10px 12px;
  border-radius:16px;
  background:rgba(216,237,243,.45);
  color:rgba(10,45,59,.82);
  font-size:12px;
  font-weight:850;
  line-height:1.45;
}

.family-panel{
  margin:22px 0;
  padding:18px;
  border-radius:26px;
  background:linear-gradient(145deg,rgba(255,254,251,.82),rgba(216,237,243,.36));
  border:1px solid rgba(10,45,59,.10);
}

.family-panel-head{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(220px,.8fr);
  gap:16px;
  align-items:start;
  margin-bottom:16px;
}

.family-panel-head h3{
  margin:0;
  color:var(--ink);
  font-size:clamp(25px,3vw,34px);
  letter-spacing:-.035em;
}

.family-panel-head p{
  margin:0;
  color:rgba(47,41,37,.68);
  line-height:1.65;
}

.parent-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}

.parent-mini{
  display:grid;
  grid-template-columns:68px 1fr;
  grid-template-areas:"img role" "img name" "img info";
  column-gap:14px;
  align-items:center;
  padding:13px;
  border-radius:22px;
  background:rgba(255,254,251,.80);
  border:1px solid rgba(10,45,59,.09);
  box-shadow:0 14px 30px rgba(10,45,59,.07);
  color:var(--ink);
}

.parent-mini img{
  grid-area:img;
  width:68px;
  height:68px;
  border-radius:18px;
  object-fit:cover;
}

.parent-mini span{
  grid-area:role;
  text-transform:uppercase;
  letter-spacing:.12em;
  font-size:10px;
  font-weight:950;
  color:var(--champagne);
}

.parent-mini strong{
  grid-area:name;
  color:var(--ink);
  font-size:18px;
}

.parent-mini small{
  grid-area:info;
  color:rgba(47,41,37,.62);
  font-weight:750;
}

.empty-parent{
  grid-template-columns:1fr;
  grid-template-areas:"role" "name" "info";
  min-height:94px;
}

.parent-grid-small{
  margin:16px 0;
}

.parent-grid-small .parent-mini{
  grid-template-columns:54px 1fr;
}

.parent-grid-small .parent-mini img{
  width:54px;
  height:54px;
  border-radius:16px;
}

.linked-puppies{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:14px;
}

.linked-puppies a{
  padding:9px 12px;
  border-radius:999px;
  background:rgba(10,45,59,.08);
  color:var(--ink);
  font-weight:900;
  font-size:12px;
}

.siblings-panel{
  margin-top:22px;
}

.puppy-description{
  margin:18px 0;
  padding:18px;
  border-radius:22px;
  background:rgba(255,254,251,.72);
  border:1px solid rgba(10,45,59,.08);
}

.puppy-description h3{
  margin:0 0 8px;
  color:var(--ink);
}

.puppy-description p{
  margin:0;
  line-height:1.65;
  color:rgba(47,41,37,.76);
}

.family-preview{
  display:grid;
  grid-template-columns:1.2fr 1fr 1fr;
  gap:12px;
  margin:2px 0 4px;
  padding:14px;
  border-radius:22px;
  background:linear-gradient(145deg,rgba(216,237,243,.42),rgba(255,254,251,.78));
  border:1px solid rgba(10,45,59,.10);
}

.family-preview.empty{
  display:block;
  color:rgba(47,41,37,.68);
  font-weight:800;
  line-height:1.5;
}

.family-preview small{
  display:block;
  text-transform:uppercase;
  letter-spacing:.10em;
  color:var(--champagne);
  font-size:10px;
  font-weight:950;
  margin-bottom:5px;
}

.family-preview strong{
  display:block;
  color:var(--ink);
  font-size:16px;
  margin-bottom:3px;
}

.family-preview span{
  color:rgba(47,41,37,.65);
  font-size:12px;
  font-weight:750;
}

.form label small{
  color:rgba(47,41,37,.58);
  text-transform:none;
  letter-spacing:0;
  font-size:11px;
  font-weight:750;
}

@media (max-width: 820px){
  .family-panel-head,
  .family-preview{
    grid-template-columns:1fr;
  }
  .parent-grid{
    grid-template-columns:1fr;
  }
}

@media (max-width: 520px){
  .parent-mini{
    grid-template-columns:56px 1fr;
    column-gap:12px;
    padding:12px;
    border-radius:18px;
  }
  .parent-mini img{
    width:56px;
    height:56px;
    border-radius:15px;
  }
}


/* =========================================================
   Galeries photos chiots
   ========================================================= */
.gallery-detail{
  display:block;
}

.gallery-detail > img{
  width:100%;
  aspect-ratio:4/4.65;
  object-fit:cover;
  border-radius:inherit;
}

.gallery-thumbs{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:9px;
  margin-top:12px;
}

.gallery-thumb{
  border:2px solid transparent;
  border-radius:16px;
  overflow:hidden;
  padding:0;
  background:rgba(255,254,251,.72);
  cursor:pointer;
  box-shadow:0 10px 24px rgba(10,45,59,.08);
}

.gallery-thumb.active{
  border-color:#0f4c63;
}

.gallery-thumb img{
  display:block;
  width:100%;
  aspect-ratio:1/1;
  object-fit:cover;
}

.gallery-admin-list{
  display:grid;
  gap:14px;
}

.gallery-admin-item{
  display:grid;
  grid-template-columns:230px 1fr;
  gap:16px;
  align-items:center;
  padding:14px;
  border-radius:22px;
  background:rgba(255,254,251,.72);
  border:1px solid rgba(10,45,59,.10);
}

.gallery-admin-item strong{
  display:block;
  color:var(--ink);
  font-size:18px;
}

.gallery-admin-item small{
  display:block;
  color:rgba(47,41,37,.62);
  font-weight:800;
  margin-top:4px;
}

.gallery-admin-thumbs{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:center;
}

.gallery-admin-thumbs em{
  color:rgba(47,41,37,.58);
  font-weight:800;
}

.gallery-admin-thumb{
  position:relative;
  display:inline-block;
}

.gallery-admin-thumb img{
  width:72px;
  height:72px;
  border-radius:16px;
  object-fit:cover;
  box-shadow:0 12px 24px rgba(10,45,59,.10);
}

.gallery-admin-thumb button{
  position:absolute;
  top:-7px;
  right:-7px;
  width:26px;
  height:26px;
  border:0;
  border-radius:50%;
  background:#8f3c32;
  color:white;
  font-size:18px;
  line-height:1;
  cursor:pointer;
  box-shadow:0 8px 18px rgba(143,60,50,.28);
}

@media (max-width: 760px){
  .gallery-thumbs{
    grid-template-columns:repeat(4,minmax(0,1fr));
  }

  .gallery-admin-item{
    grid-template-columns:1fr;
  }

  .gallery-admin-thumb img{
    width:64px;
    height:64px;
  }
}


/* =========================================================
   Correctif ADMIN mobile - tout doit rester utilisable sur téléphone
   ========================================================= */
html, body{
  max-width:100%;
  overflow-x:hidden;
}

*, *::before, *::after{
  box-sizing:border-box;
}

.card, .photo-card, .modal-box, .detail-panel, .table-wrap{
  max-width:100%;
}

.card.pad{
  overflow:hidden;
}

.dashboard > div{
  min-width:0;
}

.tab-content{
  min-width:0;
  max-width:100%;
}

.form,
.form-row,
.profile-row,
.questionnaire-row{
  min-width:0;
}

.form label,
.form input,
.form textarea,
.form select{
  min-width:0;
  max-width:100%;
}

.form textarea{
  width:100%;
}

.btn,
button,
input[type="submit"]{
  max-width:100%;
  min-width:0;
  white-space:normal;
  text-align:center;
}

input[type="file"]{
  width:100%;
  max-width:100%;
  font-size:13px;
}

/* Les tableaux restent lisibles : on fait défiler horizontalement seulement le tableau */
.table-wrap{
  width:100%;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  border-radius:24px;
}

.table-wrap table{
  min-width:760px;
}

.table-wrap::after{
  content:"Glissez le tableau de gauche à droite";
  display:none;
  padding:9px 12px 0;
  color:rgba(47,41,37,.56);
  font-size:11px;
  font-weight:850;
}

/* Galerie admin */
.gallery-admin-list,
.gallery-admin-item,
.gallery-admin-thumbs{
  min-width:0;
  max-width:100%;
}

@media (max-width: 900px){
  .dashboard{
    display:block !important;
  }

  .dashboard .grid,
  .dashboard .grid-2,
  .dashboard .grid-3,
  .dashboard .grid-4{
    grid-template-columns:1fr !important;
  }

  .side-panel{
    position:relative !important;
    top:auto !important;
    width:100%;
    display:flex !important;
    align-items:center;
    gap:8px;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    padding:12px !important;
    margin-bottom:18px;
    border-radius:24px;
  }

  .side-panel h3{
    flex:0 0 auto;
    margin:0 10px 0 0;
    font-size:18px;
  }

  .side-panel .tab-btn{
    flex:0 0 auto;
    width:auto;
    min-width:max-content;
    padding:12px 15px;
    border-radius:999px;
    font-size:12px;
    white-space:nowrap;
  }

  .tab-content.active{
    width:100%;
  }

  .form-row,
  .profile-row,
  .questionnaire-row{
    grid-template-columns:1fr !important;
  }

  .family-preview,
  .profile-check-grid,
  .parent-grid,
  .spec-grid{
    grid-template-columns:1fr !important;
  }
}

@media (max-width: 560px){
  .section{
    width:calc(100% - 16px) !important;
    padding:30px 0 !important;
  }

  .page-hero{
    width:calc(100% - 16px) !important;
    padding:34px 20px !important;
    border-radius:28px !important;
  }

  .page-hero h1{
    font-size:clamp(38px,12vw,52px) !important;
  }

  .card.pad{
    padding:20px !important;
    border-radius:28px !important;
  }

  .card.pad h3,
  .admin-card h3{
    font-size:clamp(28px,9vw,42px);
    line-height:1.05;
    overflow-wrap:anywhere;
  }

  .dashboard .grid-2 > .card,
  .dashboard .grid-3 > .card,
  .dashboard .grid-4 > .card{
    width:100%;
    min-width:0;
  }

  .form{
    gap:13px;
  }

  .form input,
  .form textarea,
  .form select{
    font-size:16px !important; /* évite le zoom iPhone */
    padding:13px 14px !important;
  }

  .form label{
    font-size:11px;
    line-height:1.35;
  }

  .form label small{
    display:block;
    line-height:1.35;
  }

  .btn{
    width:100%;
    padding:14px 16px;
    border-radius:18px;
  }

  .actions-cell{
    display:grid;
    gap:8px;
  }

  .actions-cell .btn{
    width:100%;
  }

  .table-wrap table{
    min-width:720px;
  }

  .table-wrap::after{
    display:block;
  }

  .gallery-admin-item{
    grid-template-columns:1fr !important;
    gap:12px;
    padding:13px;
  }

  .gallery-admin-thumbs{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:9px;
  }

  .gallery-admin-thumb img{
    width:100% !important;
    height:auto !important;
    aspect-ratio:1/1;
  }

  .chat-box{
    padding:12px !important;
  }

  .message{
    max-width:92% !important;
    font-size:14px;
  }

  .modal{
    padding:10px !important;
    align-items:flex-start !important;
  }

  .modal-box{
    width:100% !important;
    max-height:calc(100vh - 20px) !important;
    border-radius:24px !important;
  }

  .modal-head{
    padding:18px !important;
  }

  .modal-body{
    padding:18px !important;
  }
}

@media (max-width: 390px){
  .card.pad{
    padding:18px !important;
  }

  .side-panel{
    margin-left:-2px;
    margin-right:-2px;
  }

  .side-panel .tab-btn{
    padding:11px 13px;
    font-size:11px;
  }

  .gallery-admin-thumbs{
    grid-template-columns:repeat(2,1fr);
  }
}

/* =========================================================
   Edition admin : boutons et formulaires de modification
   ========================================================= */
.actions-cell{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
}

.actions-cell .btn-small{
  min-width:max-content;
}

@media (max-width: 560px){
  .actions-cell{
    display:grid !important;
    gap:8px;
  }

  .actions-cell .btn-small{
    width:100%;
    min-width:0;
  }

  #edit-puppy-form,
  #edit-dog-form,
  #edit-litter-form{
    gap:13px;
  }
}


/* =========================================================
   Contact + footer dynamique
   ========================================================= */
.contact-layout{
  align-items:stretch;
}

.contact-card,
.contact-form-card{
  position:relative;
  overflow:hidden;
}

.contact-card::after,
.contact-form-card::after{
  content:"";
  position:absolute;
  width:180px;
  height:180px;
  right:-70px;
  bottom:-70px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(216,237,243,.72), transparent 68%);
  pointer-events:none;
}

.contact-card h3,
.contact-form-card h3{
  margin:0 0 12px;
  color:var(--ink);
  font-size:clamp(30px,4vw,46px);
  letter-spacing:-.04em;
}

.contact-list{
  display:grid;
  gap:12px;
  margin-top:22px;
}

.contact-item{
  display:grid;
  grid-template-columns:48px 1fr;
  gap:14px;
  align-items:center;
  padding:14px 16px;
  border-radius:20px;
  background:rgba(255,254,251,.78);
  border:1px solid rgba(10,45,59,.10);
  box-shadow:0 14px 30px rgba(10,45,59,.06);
  color:var(--ink);
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

a.contact-item:hover{
  transform:translateY(-2px);
  border-color:rgba(199,168,108,.42);
  box-shadow:0 18px 36px rgba(10,45,59,.10);
}

.contact-icon{
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  border-radius:16px;
  background:linear-gradient(135deg, rgba(216,237,243,.9), rgba(255,254,251,.92));
  color:#0a3546;
  font-weight:950;
  font-size:19px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8);
}

.contact-item small{
  display:block;
  text-transform:uppercase;
  letter-spacing:.12em;
  font-size:10px;
  font-weight:950;
  color:rgba(47,41,37,.55);
  margin-bottom:3px;
}

.contact-item strong{
  display:block;
  color:var(--ink);
  overflow-wrap:anywhere;
  line-height:1.35;
}

.contact-form-card textarea{
  min-height:136px;
}

.site-footer .footer-grid a{
  text-align:center;
}

@media (max-width: 760px){
  .contact-layout{
    grid-template-columns:1fr !important;
  }

  .contact-item{
    grid-template-columns:42px 1fr;
    padding:13px;
    border-radius:18px;
  }

  .contact-icon{
    width:42px;
    height:42px;
    border-radius:14px;
    font-size:17px;
  }

  .contact-card h3,
  .contact-form-card h3{
    font-size:clamp(28px,9vw,40px);
  }

  .site-footer .footer-grid{
    grid-template-columns:1fr !important;
  }
}


/* =========================================================
   Correctif lisibilité - bloc création compte / carte foncée
   ========================================================= */
.login-card.dark label{
  color:rgba(255,255,255,.92) !important;
}

.login-card.dark label,
.login-card.dark .form label{
  text-shadow:none;
}

.login-card.dark input,
.login-card.dark textarea,
.login-card.dark select{
  background:rgba(255,255,255,.94) !important;
  color:#0a2d3b !important;
  border-color:rgba(255,255,255,.55) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8), 0 10px 24px rgba(0,0,0,.10) !important;
}

.login-card.dark input::placeholder,
.login-card.dark textarea::placeholder{
  color:rgba(10,45,59,.48) !important;
}

.login-card.dark input:focus,
.login-card.dark textarea:focus,
.login-card.dark select:focus{
  outline:2px solid rgba(231,201,139,.75);
  outline-offset:2px;
  background:#fffefb !important;
}

.login-card.dark .form-row{
  gap:16px;
}

.login-card.dark .btn-gold{
  color:#0a2d3b !important;
  font-weight:950;
}

@media (max-width: 720px){
  .login-card.dark{
    padding:24px !important;
  }
}


/* =========================================================
   Page Pomsky + badge European Pomsky Club
   ========================================================= */
.epc-badge{
  display:flex;
  align-items:center;
  gap:14px;
  padding:16px 18px;
  border-radius:24px;
  background:linear-gradient(145deg,rgba(255,254,251,.88),rgba(216,237,243,.48));
  border:1px solid rgba(10,45,59,.12);
  box-shadow:0 18px 42px rgba(10,45,59,.10), inset 0 1px 0 rgba(255,255,255,.85);
  color:var(--ink);
  margin-top:18px;
  transition:transform .22s ease, box-shadow .22s ease;
}

.epc-badge:hover{
  transform:translateY(-3px);
  box-shadow:0 24px 54px rgba(10,45,59,.16), inset 0 1px 0 rgba(255,255,255,.9);
}

.epc-badge-mark{
  width:58px;
  height:58px;
  min-width:58px;
  border-radius:20px;
  display:grid;
  place-items:center;
  background:linear-gradient(145deg,#0a3546,#1c6c84);
  color:white;
  font-weight:950;
  letter-spacing:.08em;
  box-shadow:0 14px 28px rgba(10,45,59,.22);
}

.epc-badge small{
  display:block;
  text-transform:uppercase;
  letter-spacing:.12em;
  color:var(--champagne);
  font-size:10px;
  font-weight:950;
  margin-bottom:2px;
}

.epc-badge strong{
  display:block;
  color:var(--ink);
  font-size:18px;
  line-height:1.15;
}

.epc-badge em{
  display:block;
  font-style:normal;
  color:rgba(47,41,37,.62);
  font-size:12px;
  font-weight:750;
  line-height:1.35;
  margin-top:4px;
}

.epc-badge.large{
  max-width:480px;
  margin:0;
}

.epc-band .band-grid{
  align-items:center;
}

.pomsky-intro-grid{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:22px;
  align-items:stretch;
}

.standard-panel{
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(280px,.9fr);
  gap:22px;
  align-items:center;
  padding:30px;
  border-radius:36px;
  background:linear-gradient(145deg,rgba(10,45,59,.94),rgba(24,88,106,.92));
  color:white;
  box-shadow:0 26px 70px rgba(10,45,59,.18), inset 0 1px 0 rgba(255,255,255,.15);
}

.standard-panel .eyebrow{
  color:var(--champagne-2);
}

.standard-panel h2{
  color:white;
  margin:0 0 12px;
  font-size:clamp(38px,5vw,62px);
  line-height:.95;
  letter-spacing:-.04em;
}

.standard-panel p{
  color:rgba(255,255,255,.82);
  line-height:1.75;
  margin:0;
}

.size-list{
  display:grid;
  gap:12px;
}

.size-list div{
  padding:16px 18px;
  border-radius:22px;
  background:rgba(255,255,255,.11);
  border:1px solid rgba(255,255,255,.14);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12);
}

.size-list span{
  display:block;
  text-transform:uppercase;
  letter-spacing:.12em;
  font-size:11px;
  font-weight:950;
  color:var(--champagne-2);
  margin-bottom:5px;
}

.size-list strong{
  display:block;
  color:white;
  font-size:21px;
}

.pomsky-warning-band{
  background:linear-gradient(145deg,rgba(255,254,251,.82),rgba(255,245,225,.72) 44%,rgba(216,237,243,.42));
  border:1px solid rgba(199,168,108,.20);
}

@media (max-width: 820px){
  .pomsky-intro-grid,
  .standard-panel{
    grid-template-columns:1fr;
  }

  .epc-badge.large{
    max-width:100%;
  }
}

@media (max-width: 520px){
  .epc-badge{
    align-items:flex-start;
    padding:14px;
    border-radius:20px;
  }

  .epc-badge-mark{
    width:48px;
    height:48px;
    min-width:48px;
    border-radius:17px;
    font-size:13px;
  }

  .standard-panel{
    padding:22px;
    border-radius:28px;
  }

  .size-list strong{
    font-size:18px;
  }
}


/* =========================================================
   Correctif EPC : couleurs + vrai logo
   ========================================================= */
.epc-band{
  background:
    radial-gradient(circle at 82% 18%, rgba(199,168,108,.12), transparent 14rem),
    linear-gradient(135deg,#0f3040 0%, #163f50 54%, #1e596d 100%) !important;
  color:#ffffff !important;
  border:1px solid rgba(255,255,255,.08);
}

.epc-band h2,
.epc-band h3{
  color:#ffffff !important;
}

.epc-band p{
  color:rgba(255,255,255,.78) !important;
}

.epc-band .eyebrow{
  color:var(--champagne-2) !important;
}

.pomsky-warning-band{
  background:
    radial-gradient(circle at 82% 18%, rgba(199,168,108,.12), transparent 14rem),
    linear-gradient(135deg,#143848 0%, #1b5366 60%, #205f74 100%) !important;
  color:#ffffff !important;
  border:1px solid rgba(255,255,255,.08);
}

.pomsky-warning-band h2,
.pomsky-warning-band h3{
  color:#ffffff !important;
}

.pomsky-warning-band p{
  color:rgba(255,255,255,.82) !important;
}

.pomsky-warning-band .eyebrow{
  color:var(--champagne-2) !important;
}

.epc-badge{
  display:flex;
  align-items:center;
  gap:14px;
  padding:16px 18px;
  border-radius:24px;
  background:linear-gradient(145deg,rgba(255,255,255,.95),rgba(232,243,247,.9));
  border:1px solid rgba(10,45,59,.10);
  box-shadow:0 18px 42px rgba(10,45,59,.12), inset 0 1px 0 rgba(255,255,255,.85);
  color:var(--ink) !important;
  margin-top:18px;
  transition:transform .22s ease, box-shadow .22s ease;
}

.epc-badge:hover{
  transform:translateY(-3px);
  box-shadow:0 24px 54px rgba(10,45,59,.16), inset 0 1px 0 rgba(255,255,255,.9);
}

.epc-badge-logo{
  width:64px;
  height:64px;
  min-width:64px;
  border-radius:20px;
  display:grid;
  place-items:center;
  background:white;
  overflow:hidden;
  box-shadow:0 14px 28px rgba(10,45,59,.16);
}

.epc-badge-logo img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.epc-badge small{
  display:block;
  text-transform:uppercase;
  letter-spacing:.12em;
  color:#c7a86c !important;
  font-size:10px;
  font-weight:950;
  margin-bottom:2px;
}

.epc-badge strong{
  display:block;
  color:var(--ink) !important;
  font-size:18px;
  line-height:1.15;
}

.epc-badge em{
  display:block;
  font-style:normal;
  color:rgba(47,41,37,.66) !important;
  font-size:12px;
  font-weight:750;
  line-height:1.35;
  margin-top:4px;
}

@media (max-width: 520px){
  .epc-badge-logo{
    width:52px;
    height:52px;
    min-width:52px;
    border-radius:16px;
  }
}


/* =========================================================
   Correctif textes plus sobres + titres moins énormes
   ========================================================= */

/* Accueil */
.hero h1{
  font-size:clamp(48px,6.4vw,88px) !important;
  line-height:.92 !important;
  max-width:620px;
}

/* Gros titres des pages */
.page-hero h1{
  font-size:clamp(44px,6vw,82px) !important;
  line-height:.92 !important;
  max-width:920px;
}

/* Titres de sections */
.section-title h2{
  font-size:clamp(36px,4.8vw,64px) !important;
  line-height:.96 !important;
}

/* Gros bandeaux */
.editorial-band h2,
.standard-panel h2{
  font-size:clamp(36px,4.8vw,64px) !important;
  line-height:.98 !important;
}

/* Titres dans les cartes */
.card h3,
.login-card h3,
.detail-panel h1{
  line-height:1 !important;
}

.card h3{
  font-size:clamp(28px,3vw,36px) !important;
}

/* Texte plus naturel et moins massif */
.lead,
.card p,
.section-title p,
.editorial-band p,
.page-hero p{
  line-height:1.65 !important;
}

/* Sur mobile, éviter les énormes blocs de titres */
@media (max-width: 720px){
  .hero h1{
    font-size:clamp(42px,13vw,58px) !important;
  }

  .page-hero h1{
    font-size:clamp(38px,12vw,56px) !important;
  }

  .section-title h2,
  .editorial-band h2,
  .standard-panel h2{
    font-size:clamp(34px,10vw,48px) !important;
  }

  .card h3{
    font-size:clamp(26px,8vw,34px) !important;
  }
}


/* =========================================================
   Correctif mobile : menus sans glissement horizontal
   ========================================================= */

/* Avant, les onglets devenaient une barre à faire glisser.
   Maintenant ils passent en grille, donc tout est visible directement. */
@media (max-width: 900px){
  .side-panel{
    display:grid !important;
    grid-template-columns:1fr 1fr;
    gap:10px !important;
    overflow-x:visible !important;
    -webkit-overflow-scrolling:auto !important;
    padding:14px !important;
    margin-bottom:18px !important;
    border-radius:26px !important;
  }

  .side-panel h3{
    grid-column:1 / -1;
    width:100%;
    margin:0 0 4px 0 !important;
    font-size:clamp(26px,7vw,36px) !important;
    line-height:1 !important;
  }

  .side-panel .tab-btn{
    width:100% !important;
    min-width:0 !important;
    flex:unset !important;
    justify-content:center !important;
    text-align:center !important;
    white-space:normal !important;
    padding:13px 10px !important;
    border-radius:18px !important;
    font-size:12px !important;
    line-height:1.25 !important;
    background:rgba(255,254,251,.62);
    border:1px solid rgba(10,45,59,.08);
  }

  .side-panel .tab-btn.active{
    background:rgba(216,237,243,.85) !important;
    color:var(--ink) !important;
    box-shadow:0 10px 22px rgba(10,45,59,.08);
  }
}

@media (max-width: 420px){
  .side-panel{
    grid-template-columns:1fr;
  }

  .side-panel .tab-btn{
    padding:13px 12px !important;
  }
}

/* Même logique pour les filtres de chiots : on évite la sensation de scroll horizontal. */
.filters{
  flex-wrap:wrap !important;
  overflow-x:visible !important;
}

.filters .filter-btn{
  white-space:normal !important;
}

/* Sur téléphone, on évite les éléments trop larges qui donnent envie de glisser. */
@media (max-width: 560px){
  body{
    overflow-x:hidden !important;
  }

  .dashboard,
  .tab-content,
  .card,
  .photo-card,
  .section,
  .page-hero{
    max-width:100% !important;
  }
}


/* =========================================================
   Photo accueil Gwendolina - cadrage carré propre
   ========================================================= */
.hero-photo-frame{
  aspect-ratio:1 / 1 !important;
  border-radius:46px !important;
  background:linear-gradient(145deg,#dbeef2,#fffdf9) !important;
}

.hero-photo-frame::before{
  content:"MY LITTLE POMSKY";
  position:absolute;
  left:24px;
  top:20px;
  z-index:2;
  color:rgba(255,255,255,.78);
  font-size:18px;
  font-weight:950;
  letter-spacing:.18em;
  text-shadow:0 4px 18px rgba(10,45,59,.22);
  writing-mode:horizontal-tb;
}

.hero-photo-frame img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center center !important;
  display:block !important;
}

@media (max-width:720px){
  .hero-photo-frame{
    border-radius:34px !important;
  }

  .hero-photo-frame::before{
    font-size:12px;
    left:18px;
    top:16px;
  }
}


/* =========================================================
   Correctif accueil : enlever le texte sur la photo
   ========================================================= */
.hero-photo-frame::before{
  content:none !important;
  display:none !important;
}


/* =========================================================
   Admin : listes en fiches, sans scroll horizontal
   ========================================================= */
.admin-split{
  align-items:start;
}

.admin-list-panel{
  overflow:hidden;
}

.admin-card-list{
  display:grid;
  gap:14px;
  margin-top:14px;
}

.admin-mini-card{
  display:grid;
  grid-template-columns:96px minmax(0,1fr);
  gap:16px;
  padding:12px;
  border-radius:24px;
  background:rgba(255,254,251,.72);
  border:1px solid rgba(10,45,59,.08);
  box-shadow:0 14px 32px rgba(10,45,59,.07), inset 0 1px 0 rgba(255,255,255,.75);
}

.admin-card-photo{
  width:96px;
  height:96px;
  border-radius:20px;
  overflow:hidden;
  background:rgba(216,237,243,.55);
  border:1px solid rgba(255,255,255,.8);
}

.admin-card-photo img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.admin-card-body{
  min-width:0;
}

.admin-card-top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}

.admin-card-top h4{
  margin:2px 0 8px;
  font-family:var(--serif);
  font-size:24px;
  line-height:1;
  color:var(--ink);
}

.admin-card-meta{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}

.admin-card-body p{
  margin:10px 0;
  color:rgba(47,41,37,.72);
  line-height:1.45;
}

.admin-card-actions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  justify-content:flex-end;
}

.btn-small{
  min-height:auto !important;
  padding:9px 12px !important;
  border-radius:999px !important;
  font-size:12px !important;
  white-space:nowrap;
}

.admin-card-specs{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
  margin-top:10px;
}

.admin-card-specs span{
  display:block;
  padding:10px;
  border-radius:16px;
  background:rgba(216,237,243,.46);
  border:1px solid rgba(10,45,59,.06);
}

.admin-card-specs small{
  display:block;
  text-transform:uppercase;
  letter-spacing:.10em;
  font-size:9px;
  font-weight:950;
  color:rgba(47,41,37,.52);
  margin-bottom:4px;
}

.admin-card-specs strong{
  display:block;
  color:var(--ink);
  font-size:13px;
  line-height:1.2;
}

.admin-status-select{
  margin-top:10px;
}

.admin-status-select select{
  margin-top:6px;
}

.admin-list-empty{
  padding:22px;
  border-radius:22px;
  text-align:center;
  color:rgba(47,41,37,.62);
  border:1px dashed rgba(10,45,59,.16);
  background:rgba(255,254,251,.58);
}

@media (max-width:900px){
  .admin-mini-card{
    grid-template-columns:82px minmax(0,1fr);
    border-radius:22px;
  }

  .admin-card-photo{
    width:82px;
    height:82px;
    border-radius:18px;
  }

  .admin-card-top{
    flex-direction:column;
    align-items:stretch;
  }

  .admin-card-actions{
    justify-content:flex-start;
  }

  .admin-card-specs{
    grid-template-columns:1fr;
  }
}

@media (max-width:520px){
  .admin-mini-card{
    grid-template-columns:1fr;
  }

  .admin-card-photo{
    width:100%;
    height:170px;
  }

  .admin-card-actions .btn,
  .admin-card-actions .btn-small{
    width:100%;
    justify-content:center;
  }
}


/* ID interne admin non modifiable */
.form input[disabled][readonly]{
  background:rgba(216,237,243,.42) !important;
  color:rgba(47,41,37,.58) !important;
  border-color:rgba(10,45,59,.10) !important;
  cursor:not-allowed !important;
}