/* ============================================================
   Pages villes (Yvetot, Rouen, Le Havre) — landing pages
   Chaque prestation a son univers : photos, couleurs, matière.
   ============================================================ */
.v-sec { position: relative; padding-block: clamp(4rem, 8vw, 7rem); overflow: hidden; }
main > section.v-sec { border: 0; }
.v-sec .v-eyebrow { display: inline-flex; align-items: center; gap: .7rem; font-size: var(--fs-eyebrow);
  letter-spacing: var(--tracking-eyebrow); text-transform: uppercase; font-weight: var(--w-med); }
.v-sec .v-eyebrow::before { content: ""; width: 34px; height: 1px; background: currentColor; }
.v-sec h2 { font-family: var(--font-display); font-weight: var(--w-med); font-size: var(--fs-d1);
  line-height: 1.05; margin: var(--space-4) 0 var(--space-5); }
.v-sec h2 em { font-style: italic; font-weight: var(--w-light); }
.v-sec p { font-size: var(--fs-body); line-height: var(--lh-body); }
.v-sec .v-price { display: inline-flex; align-items: baseline; gap: .5rem; margin: var(--space-5) 0 var(--space-5); }
.v-sec .v-price small { font-size: .78rem; letter-spacing: .16em; text-transform: uppercase; }
.v-sec .v-price b { font-family: var(--font-display); font-weight: var(--w-med); font-size: 2.2rem; line-height: 1; }
.v-sec .v-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.6rem; }
.v-ph { display: block; overflow: hidden; border-radius: var(--r-md); }
.v-ph img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .8s var(--ease); }
.v-ph:hover img { transform: scale(1.04); }

/* ---------- 1. Portfolio ---------- */
main > section.v-portfolio { background: #221D1A !important; color: #F4ECE1; }
.v-portfolio .v-head { text-align: center; max-width: 720px; margin: 0 auto var(--space-7); }
.v-portfolio .v-eyebrow { color: #E2C48E; }
.v-portfolio h2 { color: #FBF8F2; }
.v-portfolio h2 em { color: #E2C48E; }
.v-portfolio .v-head p { color: rgba(244,236,225,.78); }
.v-mosaic { display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: clamp(140px, 17vw, 230px);
  gap: clamp(.5rem, 1vw, .9rem); grid-auto-flow: dense; }
.v-mosaic a { position: relative; display: block; overflow: hidden; border-radius: 10px; }
.v-mosaic a:nth-child(1) { grid-column: span 2; grid-row: span 2; }
.v-mosaic a:nth-child(4) { grid-row: span 2; }
.v-mosaic a:nth-child(7) { grid-column: span 2; }
.v-mosaic a:nth-child(9) { grid-column: span 2; }
.v-mosaic a:nth-child(3) { grid-row: span 2; }
.v-mosaic img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--ease), filter .5s; }
.v-mosaic a:hover img { transform: scale(1.06); }
.v-mosaic .v-tag { position: absolute; left: .7rem; bottom: .7rem; padding: .35em .8em; border-radius: var(--r-pill);
  background: rgba(34,29,26,.72); color: #FBF8F2; font-size: .72rem; letter-spacing: .12em; text-transform: uppercase;
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.v-portfolio .v-more { text-align: center; margin-top: var(--space-7); }
.v-portfolio .btn { --btn-bg: #E2C48E; --btn-bd: #E2C48E; --btn-fg: #221D1A; background: #E2C48E; border-color: #E2C48E; color: #221D1A; }
.v-portfolio .btn:hover { background: #F0D9AE; border-color: #F0D9AE; }
@media (max-width: 760px) {
  .v-mosaic { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 42vw; }
  .v-mosaic a:nth-child(1) { grid-column: span 2; grid-row: span 1; }
  .v-mosaic a:nth-child(4) { grid-row: span 1; }
  .v-mosaic a:nth-child(7) { grid-column: span 2; }
  .v-mosaic a:nth-child(3), .v-mosaic a:nth-child(9) { grid-row: span 1; grid-column: span 1; }
  .v-mosaic a:nth-child(9) { grid-column: span 2; }
}

/* ---------- 2. Mariage : photo plein cadre, champagne & or ---------- */
main > section.v-mariage { background: #1E1A17 !important; color: #F6EFE3; min-height: 640px; display: flex; align-items: center; }
.v-mariage .v-bg { position: absolute; inset: 0; }
.v-mariage .v-bg img { width: 100%; height: 100%; object-fit: cover; object-position: 60% 40%; }
.v-mariage .v-bg::after { content: ""; position: absolute; inset: 0;
  background: linear-gradient(90deg, rgba(24,20,17,.92) 0%, rgba(24,20,17,.78) 40%, rgba(24,20,17,.15) 75%); }
.v-mariage .container { position: relative; z-index: 1; width: 100%; }
.v-mariage .v-panel { max-width: 540px; }
.v-mariage .v-eyebrow, .v-mariage h2 em, .v-mariage .v-price b { color: #E2C48E; }
.v-mariage h2 { color: #FBF8F2; }
.v-mariage p { color: rgba(246,239,227,.86); }
.v-mariage .v-price small { color: rgba(246,239,227,.7); }
.v-mariage .v-thumbs { display: flex; gap: .7rem; margin-top: var(--space-6); }
.v-mariage .v-thumbs .v-ph { width: clamp(80px, 9vw, 120px); aspect-ratio: 3/4; border: 3px solid #E2C48E; border-radius: 6px; }
.v-mariage .btn { background: #E2C48E; border-color: #E2C48E; color: #1E1A17; }
.v-mariage .btn:hover { background: #F0D9AE; border-color: #F0D9AE; }
.v-mariage .link-underline { color: #FBF8F2; }
.v-mariage .v-ornament { position: absolute; right: 4%; bottom: 8%; z-index: 1; font-family: var(--font-display);
  font-style: italic; font-size: clamp(1.1rem, 1.6vw, 1.4rem); color: #FBF8F2; opacity: .9; text-shadow: 0 2px 16px rgba(0,0,0,.5); }
@media (max-width: 760px) {
  main > section.v-mariage { min-height: 0; }
  .v-mariage .v-bg::after { background: linear-gradient(to top, rgba(24,20,17,.95) 0%, rgba(24,20,17,.82) 60%, rgba(24,20,17,.5) 100%); }
  .v-mariage .v-ornament { display: none; }
}

/* ---------- 3. Couple : tons rosés, photos superposées ---------- */
main > section.v-couple { background: #F7E4E0 !important; color: #3B2427; }
.v-couple::before { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .5;
  background-image: radial-gradient(circle at 12% 20%, #F0C9C2 0, transparent 30%), radial-gradient(circle at 90% 85%, #EBC0B8 0, transparent 28%); }
.v-couple .v-grid { position: relative; display: grid; grid-template-columns: 1.05fr .95fr; gap: clamp(2rem, 6vw, 6rem); align-items: center; }
.v-couple .v-stack { position: relative; padding: 0 12% 14% 0; }
.v-couple .v-stack .v-ph:first-child { aspect-ratio: 4/3; box-shadow: 0 30px 60px -30px rgba(80,30,35,.55); }
.v-couple .v-stack .v-ph:last-child { position: absolute; right: 0; bottom: 0; width: 46%; aspect-ratio: 3/4;
  border: 8px solid #fff; border-radius: 6px; transform: rotate(3deg); box-shadow: 0 24px 48px -20px rgba(80,30,35,.5); }
.v-couple .v-eyebrow, .v-couple h2 em, .v-couple .v-price b { color: #B04E58; }
.v-couple h2 { color: #3B2427; }
.v-couple p { color: #5E4447; }
.v-couple .btn { background: #B04E58; border-color: #B04E58; }
.v-couple .btn:hover { background: #8E3B44; border-color: #8E3B44; }
.v-couple .v-heart { color: #B04E58; }
@media (max-width: 860px) { .v-couple .v-grid { grid-template-columns: 1fr; } }

/* ---------- 4. Famille & grossesse : sauge, deux cartes ---------- */
main > section.v-famille { background: #E5EBDF !important; color: #26302A; }
.v-famille .v-head { text-align: center; max-width: 700px; margin: 0 auto var(--space-7); }
.v-famille .v-eyebrow, .v-famille h2 em { color: #5C7552; }
.v-famille .v-cards { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(1rem, 3vw, 2.2rem); }
.v-famille .v-card { background: #FBFCF8; border-radius: var(--r-lg); overflow: hidden; display: flex; flex-direction: column;
  box-shadow: 0 24px 50px -32px rgba(38,48,42,.5); transition: transform var(--t-fast); }
.v-famille .v-card:hover { transform: translateY(-6px); }
.v-famille .v-card .v-duo { display: grid; grid-template-columns: 1.4fr 1fr; gap: 4px; height: clamp(240px, 26vw, 340px); }
.v-famille .v-card .v-duo .v-ph { border-radius: 0; }
.v-famille .v-card .v-body { padding: clamp(1.4rem, 2.5vw, 2rem); display: flex; flex-direction: column; gap: .6rem; flex: 1; }
.v-famille .v-card h3 { font-family: var(--font-display); font-size: 1.9rem; font-weight: var(--w-med); line-height: 1.1; }
.v-famille .v-card h3 em { font-style: italic; color: #5C7552; font-weight: var(--w-light); }
.v-famille .v-card p { color: #4A564E; font-size: var(--fs-sm); }
.v-famille .v-card .v-foot { margin-top: auto; padding-top: .8rem; display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
.v-famille .v-card .v-foot b { font-family: var(--font-display); font-size: 1.6rem; color: #5C7552; font-weight: var(--w-med); }
.v-famille .v-card .v-foot small { font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; color: #6A766E; margin-right: .3rem; }
.v-famille .v-card .v-go { font-size: .76rem; letter-spacing: .12em; text-transform: uppercase; color: #fff; background: #5C7552;
  padding: .7em 1.2em; border-radius: var(--r-pill); white-space: nowrap; }
@media (max-width: 860px) { .v-famille .v-cards { grid-template-columns: 1fr; } }

/* ---------- 5. Animalier : automne ambré ---------- */
main > section.v-animalier { background: #2E2119 !important; color: #F6EADC; }
.v-animalier::before { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .07;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23E0A458'%3E%3Cellipse cx='6' cy='10' rx='2.1' ry='2.8'/%3E%3Cellipse cx='11' cy='7.5' rx='2.1' ry='2.9'/%3E%3Cellipse cx='16.6' cy='8.6' rx='2.1' ry='2.8'/%3E%3Cellipse cx='20' cy='13' rx='1.8' ry='2.3'/%3E%3Cpath d='M12.6 12.2c2.5 0 4.6 1.7 5.2 3.8.5 1.9-.9 3.6-2.8 3.6-1 0-1.7-.4-2.4-.4s-1.4.4-2.4.4c-1.9 0-3.3-1.7-2.8-3.6.6-2.1 2.7-3.8 5.2-3.8Z'/%3E%3C/svg%3E");
  background-size: 90px 90px; transform: rotate(-12deg) scale(1.3); }
.v-animalier .v-grid { position: relative; display: grid; grid-template-columns: .95fr 1.05fr; gap: clamp(2rem, 6vw, 5.5rem); align-items: center; }
.v-animalier .v-eyebrow, .v-animalier h2 em, .v-animalier .v-price b { color: #E0A458; }
.v-animalier h2 { color: #FBF3E8; }
.v-animalier p { color: rgba(246,234,220,.84); }
.v-animalier .v-price small { color: rgba(246,234,220,.65); }
.v-animalier .v-trio { display: grid; grid-template-columns: 1.2fr 1fr; grid-template-rows: 1fr 1fr; gap: .8rem; height: clamp(380px, 42vw, 540px); }
.v-animalier .v-trio .v-ph:first-child { grid-row: span 2; }
.v-animalier .btn { background: #E0A458; border-color: #E0A458; color: #2E2119; }
.v-animalier .btn:hover { background: #ECBB7A; border-color: #ECBB7A; }
.v-animalier .link-underline { color: #FBF3E8; }
@media (max-width: 860px) { .v-animalier .v-grid { grid-template-columns: 1fr; } .v-animalier .v-trio { height: 92vw; } }

/* ---------- 6. Séances à thème : confettis & polaroids ---------- */
main > section.v-theme { background: #FFF6E0 !important; color: #3A2F25; }
.v-theme::before { content: ""; position: absolute; inset: 0; pointer-events: none;
  background-image:
    radial-gradient(circle, #E9C46A 4px, transparent 4.5px), radial-gradient(circle, #E8A598 3.5px, transparent 4px),
    radial-gradient(circle, #9CA98C 3px, transparent 3.5px), radial-gradient(circle, #A8C5D3 4px, transparent 4.5px),
    radial-gradient(circle, #C2603F 2.5px, transparent 3px);
  background-size: 140px 120px, 170px 150px, 110px 160px, 190px 130px, 230px 210px;
  background-position: 0 0, 60px 80px, 90px 30px, 30px 100px, 120px 60px; opacity: .7; }
.v-theme .container { position: relative; }
.v-theme .v-head { text-align: center; max-width: 720px; margin: 0 auto var(--space-6); }
.v-theme .v-eyebrow { color: #C2603F; }
.v-theme h2 em { color: #C2603F; }
.v-theme .v-head p { color: #5E5045; }
.v-theme .polaroids { margin-top: var(--space-5); }
.v-theme .pola .pcap { color: #3A2F25; }
.v-theme .pola-noel { background: #FFFDFB; }
.v-theme .pola-noel .pcap { color: #8F3B36; font-weight: var(--w-med); }
.v-theme .v-more { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 1rem 1.6rem; margin-top: var(--space-7); }
.v-theme .v-price { margin: 0; }
.v-theme .v-price b { color: #C2603F; }
.v-theme .btn { background: #C2603F; border-color: #C2603F; }
.v-theme .btn:hover { background: #A44D30; border-color: #A44D30; }

/* ---------- 7. Avis : marqués, lisibles ---------- */
main > section.v-avis { background: linear-gradient(160deg, #6F5746 0%, #4A3A2E 100%) !important; color: #FBF8F2; }
.v-avis .v-head { text-align: center; max-width: 760px; margin: 0 auto var(--space-7); }
.v-avis .v-eyebrow { color: #E2C48E; }
.v-avis h2 { color: #FBF8F2; }
.v-avis h2 em { color: #E2C48E; }
.v-avis .v-stats { display: flex; justify-content: center; flex-wrap: wrap; gap: 1rem 3rem; margin-top: var(--space-5); }
.v-avis .v-stats div { text-align: center; }
.v-avis .v-stats b { display: block; font-family: var(--font-display); font-size: clamp(2.6rem, 5vw, 3.6rem); line-height: 1; color: #E2C48E; font-weight: var(--w-med); }
.v-avis .v-stats span { font-size: .8rem; letter-spacing: .14em; text-transform: uppercase; color: rgba(251,248,242,.8); }
.v-avis .avis-grid::before { display: none; }
.v-avis .avis-card { background: #FBF8F2; border: 0; box-shadow: 0 30px 60px -34px rgba(0,0,0,.6); position: relative; }
.v-avis .avis-card::before { content: "\201C"; position: absolute; top: -.2rem; right: 1.2rem; font-family: var(--font-display);
  font-size: 6rem; line-height: 1; color: #E2C48E; opacity: .55; }
.v-avis .avis-stars { color: #D4A845; }
.v-avis .avis-text { color: var(--ink); font-size: 1.02rem; }
.v-avis .v-more { text-align: center; margin-top: var(--space-7); }
.v-avis .btn { background: #E2C48E; border-color: #E2C48E; color: #2B2724; }
.v-avis .btn:hover { background: #F0D9AE; border-color: #F0D9AE; }
.v-avis .v-more .btn { white-space: nowrap; }
.v-avis .v-more .btn svg { width: 16px; height: 16px; flex: none; }
