/* GeschrevenGedichten 3.3.0 — ONE public visual system.
 * Theme owns every presentation rule. Plugin retains data, workflow and logic.
 * This stylesheet is enqueued after existing shared styles so cross-module
 * exceptions can be corrected without modifying their processing code.
 */
:root {
  --gg331-ink:#102c3b;
  --gg331-muted:#526674;
  --gg331-accent:#ec891f;
  --gg331-accent-dark:#c9630b;
  --gg331-line:#dbe3e8;
  --gg331-paper:#f7f9fa;
  --gg331-canvas:#f1f2f4;
  --gg331-serif:'Cormorant Garamond',Georgia,serif;
  --gg331-sans:'Plus Jakarta Sans',Arial,sans-serif;
  --gg331-shadow:0 14px 34px rgba(16,44,59,.075);
  --gg331-radius:22px;
  --gg331-content-width:1280px;
}
/* Keep the real site header/logo/megamenu styling untouched. */
body:not(.wp-admin) :is(main,#main-content,.gg331-global-hero) :is(h1,h2,h3,h4,h5,h6),
body:not(.wp-admin) :is(.gg3-member-hero,.gg-profile-main,.vv-profile-shell,.gg-syn-shell,.ggwh,.gg-rhyme-shell) :is(h1,h2,h3,h4) {
  font-family:var(--gg331-serif)!important;
  font-weight:600!important;
  color:var(--gg331-ink);
  letter-spacing:-.018em;
  text-wrap:balance;
}
body:not(.wp-admin) main :is(h1),
body:not(.wp-admin) .gg331-global-hero h1 {font-size:clamp(34px,4vw,56px);line-height:1.09;}
body:not(.wp-admin) main :is(h2) {font-size:clamp(28px,3.2vw,44px);line-height:1.14;}
body:not(.wp-admin) main :is(h3) {font-size:clamp(23px,2.35vw,32px);line-height:1.18;}
body:not(.wp-admin) main :is(h4) {font-size:clamp(20px,1.9vw,26px);line-height:1.2;}
body:not(.wp-admin) :is(main,.gg331-global-hero) :is(p,label,small,input,textarea,select,button,a) {font-family:var(--gg331-sans);}
body:not(.wp-admin) :is(main,.gg331-global-hero) {color:var(--gg331-ink);}
body:not(.wp-admin) :is(main,.gg331-global-hero) :is(p,.gg328-masthead__description){color:var(--gg331-muted);}

/* Split photo hero across native PHP, WP content and fallback shortcode routes. */
body:not(.wp-admin) main .gg328-masthead,
body:not(.wp-admin) .gg331-global-hero .gg328-masthead{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(0,.98fr)!important;
  width:min(var(--gg331-content-width),calc(100% - 20px))!important;
  max-width:var(--gg331-content-width)!important;
  min-height:clamp(300px,29vw,475px)!important;
  margin:0 auto clamp(25px,3vw,42px)!important;
  border-radius:var(--gg331-radius)!important;
  border:1px solid var(--gg331-line)!important;
  overflow:hidden!important;
  background:var(--gg331-paper)!important;
  box-shadow:var(--gg331-shadow)!important;
  isolation:isolate;
}
body:not(.wp-admin) :is(main,.gg331-global-hero) .gg328-masthead__copy{
  display:flex;flex-direction:column;align-items:flex-start;justify-content:center;
  min-width:0;padding:clamp(27px,4.3vw,64px)!important;
}
body:not(.wp-admin) :is(main,.gg331-global-hero) .gg328-masthead__eyebrow{
  color:#ae510b!important;font:750 clamp(10px,.85vw,13px)/1.4 var(--gg331-sans)!important;
  letter-spacing:.135em;text-transform:uppercase;margin:0 0 18px!important;
}
body:not(.wp-admin) :is(main,.gg331-global-hero) .gg328-masthead h1{
  max-width:17ch!important;font:600 clamp(39px,4.6vw,69px)/.99 var(--gg331-serif)!important;
  letter-spacing:-.027em!important;color:var(--gg331-ink)!important;
  margin:0 0 16px!important;overflow-wrap:break-word;
}
body:not(.wp-admin) :is(main,.gg331-global-hero) .gg328-masthead__description{
  font:400 clamp(14px,1.12vw,17px)/1.7 var(--gg331-sans)!important;
  max-width:54ch;color:var(--gg331-muted)!important;margin:0!important;
}
body:not(.wp-admin) :is(main,.gg331-global-hero) .gg328-masthead__rule{
  display:block!important;width:48px!important;height:2px!important;border-radius:3px;
  margin:19px 0 11px!important;background:var(--gg331-accent-dark)!important;
}
body:not(.wp-admin) :is(main,.gg331-global-hero) .gg328-masthead__breadcrumbs{font:500 12px/1.55 var(--gg331-sans)!important;max-width:100%;}
body:not(.wp-admin) :is(main,.gg331-global-hero) .gg328-masthead__image{
  display:block!important;position:relative;min-height:100%!important;
  background:#eddbca;overflow:hidden;
}
body:not(.wp-admin) :is(main,.gg331-global-hero) .gg328-masthead__image img{
  display:block;width:100%!important;height:100%!important;min-height:300px!important;
  object-fit:cover!important;object-position:center center;
}
body:not(.wp-admin) :is(main,.gg331-global-hero) .gg328-masthead__actions{margin-top:23px!important;gap:12px;}
body:not(.wp-admin) :is(main,.gg331-global-hero) .gg328-masthead__button{
  display:inline-flex;align-items:center;justify-content:center;gap:20px;
  min-height:48px;padding:12px 21px;border-radius:12px!important;
  background:var(--gg331-accent)!important;color:var(--gg331-ink)!important;
  border:1px solid #df7d18!important;box-shadow:0 7px 16px rgba(183,98,23,.1);
  font:750 13px/1.35 var(--gg331-sans)!important;text-decoration:none!important;
}
body:not(.wp-admin) :is(main,.gg331-global-hero) .gg328-masthead__button--secondary{
  background:#fff!important;border-color:#cbd8df!important;box-shadow:none!important;
}
body:not(.wp-admin) :is(main,.gg331-global-hero) .gg328-masthead__button:is(:hover,:focus-visible){background:#ffdba7!important;}
/* Fallback is after header, before the actual main; prevent a second 35px top margin. */
body:not(.wp-admin) .gg331-global-hero{width:100%;margin:35px auto 0;max-width:var(--gg331-content-width);}
body.gg331-fallback-hero-active main{margin-top:0!important;padding-top:0!important;}
body.gg331-fallback-hero-active main .ggw-breadcrumb{display:none!important;}
/* Legacy plugin intro text is useful, but never show its second headline. */
body.gg331-fallback-hero-active main :is(.gg-syn-hero,.gg-rhyme-hero,.gg307-rhyme-intro,.ggwh-rhyme-hero,.gg321-writersblok-intro,.gg307-source-intro,.gg-popular-rhymes) :is(h1,h2):first-of-type,
body:not(.wp-admin) .ggw-system-page--self-heading :is(.ggwh-rhyme-hero,.gg321-writersblok-intro,.gg307-source-intro) h2:first-of-type {
  display:none!important;
}
/* WP nested shortcode/profile layout beneath the universal masthead remains useful. */
body:not(.wp-admin) .ggw-system-page--self-heading .gg3-member-hero{
  border:1px solid var(--gg331-line)!important;background:#fff!important;
  box-shadow:0 7px 20px rgba(16,44,59,.04)!important;
  border-radius:19px!important;padding:clamp(14px,2vw,24px)!important;margin:0 0 20px!important;
}
body:not(.wp-admin) .ggw-system-page--self-heading .gg3-member-hero__copy>p{margin-bottom:0!important;}
/* Do not hide the identity avatar, points or profile links. */

/* Homepage remains the single existing hero; matching typography and buttons only. */
body:not(.wp-admin) main.gg326-appelscha-home .gg326-home-masthead h1{
  font:600 clamp(55px,6.4vw,94px)/.96 var(--gg331-serif)!important;
  max-width:10ch!important;letter-spacing:-.028em!important;
}
body:not(.wp-admin) main.gg326-appelscha-home .gg326-home-masthead{border-radius:24px!important;overflow:hidden;}
body:not(.wp-admin) main.gg326-appelscha-home .gg326-home-masthead__content{min-width:0;}

/* A coherent CTA vocabulary: bright primary and clean outlined secondary. */
body:not(.wp-admin) main :is(.gg326-button--primary,.gg327-cta .gg326-button--primary,.gg-editorial-button,.gg3-member-button--primary,.ggwh-primary,.gg305-prent-actions .gg305-prent-design){
  background:var(--gg331-accent)!important;border:1px solid #df7d18!important;
  color:#102c3b!important;box-shadow:0 6px 14px rgba(183,98,23,.09)!important;
  border-radius:12px!important;font-family:var(--gg331-sans)!important;font-weight:750!important;
  min-height:46px;text-decoration:none!important;
}
body:not(.wp-admin) main :is(.gg326-button--secondary,.gg3-member-button:not(.gg3-member-button--primary),.gg327-cta .gg326-button--secondary){
  background:#fff!important;color:#102c3b!important;border:1px solid #cbd8df!important;
  border-radius:12px!important;box-shadow:none!important;
}
body:not(.wp-admin) main .gg327-cta{
  background:linear-gradient(115deg,#fff9f1,#fff4e3)!important;
  border:1px solid #ebd9c6!important;border-radius:22px!important;
  box-shadow:0 10px 25px rgba(16,44,59,.05)!important;
}
body:not(.wp-admin) main :is(.gg327-cta,.gg3-member-dashboard,.gg-wh-inner,.gg-profile-main) :is(a,button):focus-visible,
body:not(.wp-admin) :is(main,.gg331-global-hero) :is(button,a,input,textarea,select,summary):focus-visible{
  outline:3px solid var(--gg331-accent-dark)!important;outline-offset:3px;
}
/* Neutral consistent form and card surfaces where legacy rules vary. */
body:not(.wp-admin) main :is(.gg-syn-searchrow,.gg-rhyme-search,.gg329-directory-form,.ggwh-tool-panel,.gg327-poem-grid,.ggwh-side-panel,.gg-profile-main,.gg3-department-card){max-width:100%;min-width:0;}
body:not(.wp-admin) main :is(input[type="text"],input[type="email"],input[type="search"],input[type="url"],textarea,select):not(.wp-block-search__input){border-radius:12px;border-color:#cbd8df;}
body:not(.wp-admin) main :is(.ggwh-side-panel,.gg3-department-card,.gg-book-card,.gg-poet-portrait-card){border-radius:18px;}

/* Premium dark prent banner, scoped to the single-poem Downloadatelier card. */
body.single-gebruikers_gedicht main .gg315-atelier-promo.gg305-integrated-prent{
  background:#071f2d!important;border:1px solid #173a4b!important;
  border-radius:23px!important;box-shadow:0 15px 30px rgba(5,29,44,.15)!important;
  color:#f8f7f1!important;max-width:100%;
}
body.single-gebruikers_gedicht main .gg315-atelier-promo.gg305-integrated-prent :is(h2,.ggw-eyebrow){color:#fff8ee!important;}
body.single-gebruikers_gedicht main .gg315-atelier-promo.gg305-integrated-prent :is(p,.gg315-atelier-promo__note,.gg485-prent-preview__label){color:#d6e3e9!important;}
body.single-gebruikers_gedicht main .gg315-atelier-promo.gg305-integrated-prent .ggw-eyebrow{color:#f9bb7a!important;}
body.single-gebruikers_gedicht main .gg315-atelier-promo.gg305-integrated-prent .gg305-prent-design{
  background:#fff!important;color:#102c3b!important;border-color:#e6dacf!important;
}
body.single-gebruikers_gedicht main .gg315-atelier-promo.gg305-integrated-prent :is(button,.gg305-prent-actions>a:not(.gg305-prent-design)){
  background:#ff981f!important;border-color:#f0a14c!important;color:#081f2c!important;border-radius:12px!important;
}
body.single-gebruikers_gedicht main .gg315-atelier-promo.gg305-integrated-prent .gg485-prent-preview__art{
  background:#f9f9f6!important;box-shadow:0 7px 20px rgba(0,0,0,.18)!important;
}

/* Profile navigation: same left edge and fixed width icon column. */
html body:not(.wp-admin) .vv-profile-shell.ggw-account-v16 .gg-profile-sidebar .gg3-member-nav{
  display:block!important;text-align:left!important;
}
html body:not(.wp-admin) .vv-profile-shell.ggw-account-v16 .gg-profile-sidebar .gg3-member-nav__group{
  display:block!important;text-align:left!important;
}
html body:not(.wp-admin) .vv-profile-shell.ggw-account-v16 .gg-profile-sidebar .gg3-member-nav__heading{
  padding:8px 12px 12px!important;text-align:left!important;
}
html body:not(.wp-admin) .vv-profile-shell.ggw-account-v16 .gg-profile-sidebar .vv-profile-nav-link{
  display:grid!important;grid-template-columns:20px minmax(0,1fr)!important;
  align-items:center!important;justify-content:start!important;
  gap:12px!important;text-align:left!important;width:100%!important;
  padding:10px 12px!important;margin:2px 0!important;
  min-height:44px!important;border-radius:11px!important;
  font:550 13px/1.4 var(--gg331-sans)!important;
}
html body:not(.wp-admin) .vv-profile-shell.ggw-account-v16 .gg-profile-sidebar .vv-profile-nav-link>i{
  width:20px!important;min-width:20px!important;margin:0!important;
  flex:none!important;text-align:center!important;justify-self:center;
}
html body:not(.wp-admin) .vv-profile-shell.ggw-account-v16 .gg-profile-sidebar .vv-profile-nav-link>span{
  display:block!important;min-width:0!important;text-align:left!important;
}
html body:not(.wp-admin) .vv-profile-shell.ggw-account-v16 .gg-profile-sidebar .vv-profile-nav-link.is-active{
  background:#e8eff4!important;border-color:#d4e0e8!important;
}

/* Mobile menu — identical little disclosure triangle for Startpagina, and account CTA stack. */
@media(max-width:1020px){
  html body #vv49-shell-header #vv49-mobile .vv49-mobile-home{
    display:flex!important;align-items:center!important;justify-content:flex-start!important;
    gap:12px!important;padding:13px 12px!important;margin:0!important;
    font-weight:700!important;border-bottom:1px solid #e8edf0!important;
  }
  html body #vv49-shell-header #vv49-mobile .gg331-menu-chevron{
    display:inline-flex!important;width:10px!important;flex:none!important;align-items:center!important;
    font-size:12px!important;line-height:1!important;color:#173041!important;
  }
  html body #vv49-shell-header #vv49-mobile .gg331-mobile-action{
    display:flex!important;align-items:center;justify-content:center;
    width:100%!important;min-height:48px;margin:10px 0 0!important;
    padding:12px 16px!important;text-align:center!important;
    border-radius:999px!important;text-decoration:none!important;
    background:#fff1df!important;border:1px solid #e8b780!important;
    color:#102c3b!important;font:700 14px/1.35 var(--gg331-sans)!important;
  }
  html body #vv49-shell-header #vv49-mobile .gg331-mobile-action--profile{background:#fff!important;border-color:#cad6dd!important;}
  html body #vv49-shell-header #vv49-mobile .gg331-mobile-action--logout{background:transparent!important;border-color:transparent!important;color:#526674!important;}
}
@media(min-width:1021px){html body #vv49-shell-header #vv49-mobile .gg331-mobile-action{display:none!important;}}

@media(max-width:940px){
  body:not(.wp-admin) main .gg328-masthead,
  body:not(.wp-admin) .gg331-global-hero .gg328-masthead{
    grid-template-columns:minmax(0,1.06fr) minmax(0,.94fr)!important;
    min-height:290px!important;
  }
  body:not(.wp-admin) :is(main,.gg331-global-hero) .gg328-masthead__copy{padding:clamp(24px,3vw,36px)!important;}
  body:not(.wp-admin) :is(main,.gg331-global-hero) .gg328-masthead h1{font-size:clamp(38px,4.4vw,52px)!important;}
}
@media(max-width:680px){
  body:not(.wp-admin) main .gg328-masthead,
  body:not(.wp-admin) .gg331-global-hero .gg328-masthead{
    display:flex!important;flex-direction:column!important;
    width:calc(100% - 20px)!important;min-height:0!important;
    border-radius:19px!important;margin-bottom:26px!important;
  }
  body:not(.wp-admin) :is(main,.gg331-global-hero) .gg328-masthead__copy{
    order:0!important;padding:clamp(23px,5vw,32px)!important;
  }
  body:not(.wp-admin) :is(main,.gg331-global-hero) .gg328-masthead h1{
    font-size:clamp(35px,9.3vw,49px)!important;line-height:1.02!important;
  }
  body:not(.wp-admin) :is(main,.gg331-global-hero) .gg328-masthead__image{
    order:1!important;height:clamp(155px,44vw,250px)!important;
    min-height:0!important;width:100%;
  }
  body:not(.wp-admin) :is(main,.gg331-global-hero) .gg328-masthead__image img{
    height:100%!important;min-height:0!important;width:100%!important;
  }
  body:not(.wp-admin) :is(main,.gg331-global-hero) .gg328-masthead__button{
    flex:1 1 140px!important;max-width:100%;
  }
  body:not(.wp-admin) main.gg326-appelscha-home .gg326-home-masthead h1{
    font-size:clamp(48px,11.8vw,68px)!important;
  }
  body:not(.wp-admin) main :is(h2){font-size:clamp(28px,7vw,36px);}
  body:not(.wp-admin) main :is(h3){font-size:clamp(23px,5.6vw,29px);}
  body:not(.wp-admin) .vv-profile-shell .gg3-member-layout{min-width:0;}
  body:not(.wp-admin) main .gg327-cta{min-width:0!important;}
  body:not(.wp-admin) main .gg327-cta__body{min-width:0;}
}
@media(max-width:390px){
  body:not(.wp-admin) :is(main,.gg331-global-hero) .gg328-masthead__actions{width:100%;}
  body:not(.wp-admin) :is(main,.gg331-global-hero) .gg328-masthead__button{flex:1 1 100%!important;}
}
@media(prefers-reduced-motion:reduce){
  body:not(.wp-admin) main :is(.gg328-masthead__button,.gg326-button,.gg327-cta a){transition:none!important;transform:none!important;}
}

/* Fallback heroes sit directly after the header, outside <main>.
   Give their breadcrumbs the same unnumbered horizontal treatment as native heroes. */
body:not(.wp-admin) .gg331-global-hero .gg328-masthead__breadcrumbs ol {
  display:flex!important;flex-wrap:wrap!important;align-items:center!important;
  gap:5px 0!important;list-style:none!important;margin:0!important;padding:0!important;
}
body:not(.wp-admin) .gg331-global-hero .gg328-masthead__breadcrumbs li {
  display:flex!important;align-items:center!important;list-style:none!important;
  gap:8px!important;margin:0 10px 0 0!important;padding:0!important;
  min-width:0;color:#617886;
}
body:not(.wp-admin) .gg331-global-hero .gg328-masthead__breadcrumbs a {
  color:#526674!important;text-decoration:none!important;font:500 12px/1.5 var(--gg331-sans)!important;
}
body:not(.wp-admin) .gg331-global-hero .gg328-masthead__breadcrumbs [aria-current="page"] {
  color:#ab540d!important;font-weight:700!important;
}
body:not(.wp-admin) .gg331-global-hero .gg328-masthead__breadcrumbs a:is(:hover,:focus-visible) {
  text-decoration:underline!important;
}
/* Some legacy template or third-party shortcode pages still print their own H1.
   Their global hero supplies the visible page heading; the older H1 is not
   shown twice. Module-specific server-side changes remove most of these. */
body.gg331-fallback-hero-active:not(.wp-admin) main h1 {display:none!important;}
/* Where the Writersblok module has its own old introductory art/heading,
   keep its search controls but remove only the redundant top graphic. */
body:not(.wp-admin) .ggw-system-page--self-heading .ggwh[data-view]:not([data-view="home"])>.gg321-writersblok-intro,
body.gg331-fallback-hero-active:not(.wp-admin) .ggwh[data-view]:not([data-view="home"])>.gg321-writersblok-intro {display:none!important;}
body:not(.wp-admin) .ggw-system-page--self-heading .ggwh[data-view="home"]>.gg321-writersblok-intro .ggwh-wow-hero-art,
body.gg331-fallback-hero-active:not(.wp-admin) .ggwh[data-view="home"]>.gg321-writersblok-intro .ggwh-wow-hero-art {display:none!important;}
body:not(.wp-admin) .ggwh[data-view="home"]>.gg321-writersblok-intro {
  display:block!important;max-width:1280px!important;margin:0 auto 26px!important;
  background:transparent!important;box-shadow:none!important;min-height:0!important;
}

/* The shared CTA treatments also cover legacy search and signup modules.
   Controls retain their real HTML actions and JavaScript behaviors. */
body:not(.wp-admin) main :is(
  .gg-rhyme-search button[type="submit"],
  .gg-syn-searchrow button[type="submit"],
  .ggwh-rhyme-search button[type="submit"],
  .ggw-btn--primary,
  .ggw-hub-button:not(.ggw-hub-button--ghost),
  .gg-poet-button--primary,
  .gg328-register-submit,
  .vv-login-form button[type="submit"]
) {
  color:var(--gg331-ink)!important;background:var(--gg331-accent)!important;
  border:1px solid #df7d18!important;border-radius:12px!important;
  box-shadow:0 6px 16px rgba(166,88,20,.09)!important;
  font:750 13px/1.35 var(--gg331-sans)!important;
  min-height:46px;padding:12px 19px;
}
body:not(.wp-admin) main :is(
  .ggw-btn--secondary,
  .ggw-hub-button--ghost,
  .gg-poet-button--outline
) {
  background:#fff!important;color:var(--gg331-ink)!important;
  border:1px solid #cbd8df!important;border-radius:12px!important;
  box-shadow:none!important;min-height:46px;
}
@media(hover:hover) and (pointer:fine) {
  body:not(.wp-admin) main :is(
    .gg-rhyme-search button[type="submit"],
    .gg-syn-searchrow button[type="submit"],
    .ggwh-rhyme-search button[type="submit"],
    .ggw-btn--primary,
    .ggw-hub-button:not(.ggw-hub-button--ghost),
    .gg-poet-button--primary,
    .gg328-register-submit,
    .vv-login-form button[type="submit"]
  ):hover {background:#ffba65!important;}
}

/* Studio and writer tools are working areas, not a second billboard hero. */
body:not(.wp-admin) main :is(.gg316-studio-workbench,.gg317-studio-surface,.ggw-system-page__content,.ggwh-tool-panel){
  min-width:0;max-width:100%;
}
body:not(.wp-admin) main .gg316-studio-intro{
  min-height:0!important;max-height:none!important;
  margin:0 0 clamp(16px,2.5vw,28px)!important;
  padding:clamp(18px,2.5vw,30px)!important;
  box-shadow:none!important;
}
body:not(.wp-admin) main .gg316-studio-intro :is(h2,h3){
  font-size:clamp(25px,2.8vw,36px)!important;
  line-height:1.15!important;
}
body:not(.wp-admin) main .ggw-system-page__content:has(.gg3-member-dashboard){
  border:0!important;background:transparent!important;box-shadow:none!important;
  padding-top:0!important;
}
/* Across tool and shortcode pages, prevent legacy intro wrappers from reserving
   hundreds of pixels after the real page hero has already been rendered. */
body:not(.wp-admin) main :is(.gg-wh-hero,.ggwh-wow-hero,.gg321-writersblok-intro,.gg-syn-hero,.gg307-rhyme-intro,.gg-rhyme-hero){
  height:auto!important;max-height:none!important;min-height:0!important;
}
body:not(.wp-admin) .ggw-system-page--self-heading :is(.ggwh,.gg-syn-shell,.gg-popular-rhymes) :is(.ggwh-inner,.ggwh-modes,.gg-syn-results){
  max-width:100%;min-width:0;
}
@media(max-width:680px){
  body:not(.wp-admin) main :is(.gg-syn-searchrow,.gg-rhyme-search,.ggwh-rhyme-search){
    max-width:100%!important;min-width:0!important;
  }
  body:not(.wp-admin) main :is(.gg-syn-searchrow,.gg-rhyme-search,.ggwh-rhyme-search) :is(input[type="search"],button){
    max-width:100%!important;min-width:0!important;
  }
  body:not(.wp-admin) main :is(.gg3-member-dashboard,.ggwh-side-panel,.ggwh-tool-panel){max-width:100%!important;}
}
