/*
Theme Name: Sounds Debatable
Theme URI: https://soundsdebatable.com/
Author: Sounds Debatable
Description: Curated-library theme for Sounds Debatable. Adds a Picks content type with categories, a homepage built from those picks, and Customizer settings for the hero, consulting band and newsletter.
Version: 1.0.1
Requires at least: 6.2
Requires PHP: 7.4
License: GPL-2.0-or-later
Text Domain: sounds-debatable
*/

:root{
  --sd-cream:#F2EEE4;
  --sd-sand:#CDC6B5;
  --sd-black:#000000;
  --sd-gray:#686868;
  --sd-green:#00FF00;
  --sd-white:#FFFFFF;
  --sd-serif:"Lora",Georgia,"Times New Roman",serif;
  --sd-sans:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  --sd-logo:"Anton",Impact,"Arial Narrow",sans-serif;
  --sd-wrap:1280px;
  --sd-gutter:clamp(1rem,4vw,2.5rem);
  --sd-radius:14px;
}

*,body.sd *::before,body.sd *::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body.sd{margin:0;background:var(--sd-cream);color:var(--sd-black);font-family:var(--sd-sans);font-size:1rem;line-height:1.55;overflow-x:hidden}
body.sd img:where(:not(.elementor *)){max-width:100%;height:auto;display:block}
body.sd a:where(:not(.elementor *)){color:inherit;text-decoration:none}
body.sd a:focus-visible,body.sd button:focus-visible,body.sd input:focus-visible{outline:2px solid var(--sd-green);outline-offset:3px}
body.sd h1:where(:not(.elementor *)),body.sd h2:where(:not(.elementor *)),body.sd h3:where(:not(.elementor *)){font-family:var(--sd-serif);font-weight:600;letter-spacing:-0.015em;line-height:1.12;margin:0;color:inherit}
body.sd p:where(:not(.elementor *)){margin:0}
body.sd .screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
body.sd .skip-link:focus{position:fixed;top:8px;left:8px;width:auto;height:auto;clip:auto;z-index:100;background:var(--sd-green);color:#000;padding:.6rem 1rem;border-radius:8px}

body.sd .sd-wrap{max-width:var(--sd-wrap);margin:0 auto;padding:0 var(--sd-gutter)}

/* Buttons */
body.sd .sd-btn{display:inline-flex;align-items:center;justify-content:center;height:50px;padding:0 1.5rem;border-radius:10px;font-weight:600;border:0;font:inherit;font-weight:600;cursor:pointer}
body.sd .sd-btn--green{background:var(--sd-green);color:var(--sd-black)}
body.sd .sd-btn--black{background:var(--sd-black);color:var(--sd-cream)}
body.sd .sd-btn--small{height:42px;padding:0 1.15rem;border-radius:8px;font-size:.92rem}

/* Header */
body.sd .sd-header{background:var(--sd-black);position:relative;z-index:20}
body.sd .sd-header__inner{height:72px;display:flex;align-items:center;justify-content:space-between;gap:2rem}
body.sd .sd-logo{font-family:var(--sd-logo);color:var(--sd-green);font-size:1.55rem;line-height:.9;text-transform:uppercase;transform:skewX(-8deg);display:inline-block}
body.sd .sd-logo img{max-height:44px;width:auto}
body.sd .custom-logo-link{display:inline-flex;align-items:center}
body.sd .custom-logo-link img,body.sd img.custom-logo{max-height:44px;width:auto;height:auto}
body.sd .sd-footer .custom-logo-link img,body.sd .sd-footer img.custom-logo{max-height:56px}
body.sd .sd-nav ul{list-style:none;margin:0;padding:0;display:flex;gap:2.25rem;font-size:.92rem;font-weight:500}
body.sd .sd-nav a{color:var(--sd-cream)}
body.sd .sd-nav a:hover,body.sd .sd-nav .current-menu-item>a{color:var(--sd-green)}
body.sd .sd-nav .sub-menu{display:none}
body.sd .sd-header__actions{display:flex;align-items:center;gap:.75rem}
body.sd .sd-menu-toggle{display:none;width:44px;height:44px;border:1px solid var(--sd-gray);border-radius:8px;background:transparent;align-items:center;justify-content:center;cursor:pointer}
body.sd .sd-menu-toggle svg{stroke:var(--sd-cream)}
@media (max-width:900px){
  body.sd .sd-menu-toggle{display:inline-flex}
  body.sd .sd-header .sd-btn{display:none}
  body.sd .sd-nav{display:none;position:absolute;top:72px;left:0;right:0;background:var(--sd-black);border-top:1px solid #222;padding:1rem var(--sd-gutter) 1.5rem}
  body.sd .sd-nav.is-open{display:block}
  body.sd .sd-nav ul{flex-direction:column;gap:0}
  body.sd .sd-nav a{display:flex;align-items:center;min-height:48px;font-size:1.05rem}
  body.sd .sd-nav .sub-menu{display:block;padding-left:1rem}
}

/* Hero */
body.sd .sd-hero{max-width:900px;margin:0 auto;padding:clamp(4rem,9vw,7.5rem) var(--sd-gutter) clamp(2.5rem,5vw,3.5rem);text-align:center}
body.sd .sd-hero h1{font-size:clamp(2.6rem,4.2vw + 1rem,4.9rem);line-height:1.06;letter-spacing:-0.025em}
body.sd .sd-hero h1 em{font-style:italic;text-decoration:underline;text-decoration-color:var(--sd-green);text-decoration-thickness:.09em;text-underline-offset:.12em}
body.sd .sd-hero__text{margin:1.5rem auto 0;max-width:34rem;font-size:clamp(1.05rem,.4vw + .95rem,1.2rem);color:var(--sd-gray)}
body.sd .sd-hero__actions{display:flex;flex-wrap:wrap;justify-content:center;gap:.75rem;margin-top:2rem}
body.sd .sd-trusted{margin-top:2.5rem;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:.75rem 2rem;color:var(--sd-gray);font-size:.9rem}
body.sd .sd-trusted strong{color:var(--sd-black);font-weight:600;opacity:.8}

/* Artwork wall */
body.sd .sd-wall{overflow:hidden;padding:1rem 0 clamp(3.5rem,7vw,5.5rem)}
body.sd .sd-wall__track{display:flex;gap:20px;width:max-content;padding:12px 0;animation:sd-scroll 60s linear infinite}
body.sd .sd-wall:hover .sd-wall__track,body.sd .sd-wall:focus-within .sd-wall__track{animation-play-state:paused}
body.sd .sd-wall__item{flex:none;width:210px;aspect-ratio:4/5;border-radius:var(--sd-radius);overflow:hidden;background:var(--sd-sand)}
body.sd .sd-wall__item:nth-child(6n+1){transform:rotate(-3deg)}
body.sd .sd-wall__item:nth-child(6n+2){transform:rotate(2deg)}
body.sd .sd-wall__item:nth-child(6n+3){transform:rotate(-1.5deg)}
body.sd .sd-wall__item:nth-child(6n+4){transform:rotate(3deg)}
body.sd .sd-wall__item:nth-child(6n+5){transform:rotate(-2.5deg)}
body.sd .sd-wall__item:nth-child(6n){transform:rotate(1.5deg)}
body.sd .sd-wall__item img{width:100%;height:100%;object-fit:cover}
@keyframes sd-scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){body.sd .sd-wall__track{animation:none}}
@media (max-width:600px){body.sd .sd-wall__item{width:150px}}

/* Rows */
body.sd .sd-rows{display:flex;flex-direction:column;gap:clamp(3.5rem,6vw,5rem)}
body.sd .sd-row__head{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;margin-bottom:1.25rem}
body.sd .sd-row__head h2{font-size:clamp(1.5rem,1vw + 1.1rem,2rem)}
body.sd .sd-more{font-weight:500;white-space:nowrap}
body.sd .sd-more:hover{text-decoration:underline;text-decoration-color:var(--sd-green);text-decoration-thickness:2px;text-underline-offset:5px}
body.sd .sd-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
@media (max-width:1000px){
  body.sd .sd-grid--scroll{grid-auto-flow:column;grid-template-columns:none;grid-auto-columns:minmax(240px,42%);overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:6px}
  body.sd .sd-grid--scroll>*{scroll-snap-align:start}
}
@media (max-width:600px){body.sd .sd-grid--scroll{grid-auto-columns:78%}}

/* Cards */
body.sd .sd-card__media{border-radius:var(--sd-radius);overflow:hidden;background:var(--sd-sand);position:relative;display:flex;align-items:center;justify-content:center;color:var(--sd-black);font-size:.85rem;text-align:center;padding:0}
body.sd .sd-card__media img{width:100%;height:100%;object-fit:cover}
body.sd .sd-card__media--square{aspect-ratio:1/1}
body.sd .sd-card__media--wide{aspect-ratio:16/10}
body.sd .sd-card__media--video{aspect-ratio:16/9;background:var(--sd-black);color:var(--sd-sand)}
body.sd .sd-card__play{position:absolute;left:14px;bottom:14px;width:38px;height:38px;border-radius:50%;background:var(--sd-green);display:flex;align-items:center;justify-content:center}
body.sd .sd-card__title{margin-top:.85rem;font-weight:600}
body.sd .sd-card__meta{margin-top:.1rem;font-size:.9rem;color:var(--sd-gray)}
body.sd .sd-card:hover .sd-card__title{text-decoration:underline;text-decoration-color:var(--sd-green);text-decoration-thickness:2px;text-underline-offset:4px}

body.sd .sd-note{display:flex;flex-direction:column;justify-content:space-between;gap:2rem;min-height:220px;padding:1.5rem;border-radius:var(--sd-radius);background:var(--sd-black);color:var(--sd-cream)}
body.sd .sd-note__text{font-family:var(--sd-serif);font-size:1.3rem;line-height:1.3}
body.sd .sd-note__by{font-size:.9rem}
body.sd .sd-note__by span{color:var(--sd-sand)}

body.sd .sd-tools{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,190px),1fr));gap:14px}
body.sd .sd-tool{display:flex;align-items:center;gap:.85rem;padding:.9rem;border-radius:12px;background:var(--sd-white)}
body.sd .sd-tool__icon{flex:none;width:44px;height:44px;border-radius:10px;background:var(--sd-sand);overflow:hidden}
body.sd .sd-tool__icon img{width:100%;height:100%;object-fit:cover}
body.sd .sd-tool__name{display:block;font-weight:600}
body.sd .sd-tool__kind{display:block;font-size:.85rem;color:var(--sd-gray)}

/* Consulting band */
body.sd .sd-consult{margin-top:clamp(4rem,7vw,6rem);background:var(--sd-black);color:var(--sd-cream)}
body.sd .sd-consult__inner{padding-top:clamp(3.5rem,7vw,5.5rem);padding-bottom:clamp(3.5rem,7vw,5.5rem);display:flex;flex-wrap:wrap;gap:3rem;align-items:flex-start}
body.sd .sd-consult__intro{flex:1 1 340px}
body.sd .sd-consult__intro h2{font-size:clamp(1.9rem,2vw + 1rem,2.8rem);letter-spacing:-0.02em}
body.sd .sd-consult__intro p{margin:1rem 0 1.75rem;color:var(--sd-sand);max-width:30rem}
body.sd .sd-services{flex:1.4 1 420px;display:flex;flex-direction:column}
body.sd .sd-service{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.35rem 2rem;padding:1.35rem 0;border-top:1px solid var(--sd-gray)}
body.sd .sd-service__title{font-family:var(--sd-serif);font-size:1.35rem;font-weight:600}
body.sd .sd-service__text{flex:1 1 260px;max-width:26rem;color:var(--sd-sand)}
body.sd .sd-service:hover .sd-service__title{color:var(--sd-green)}

/* Lists */
body.sd .sd-lists{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:3rem 4rem}
body.sd .sd-list a{display:flex;justify-content:space-between;gap:1rem;padding:.85rem 0;border-bottom:1px solid var(--sd-sand)}
body.sd .sd-list__name{font-weight:600}
body.sd .sd-list__aside{color:var(--sd-gray);text-align:right}
body.sd .sd-list__date{flex:none;width:4.5rem;color:var(--sd-gray);font-size:.9rem;padding-top:.1rem;text-align:left}
body.sd .sd-list--news a{justify-content:flex-start;gap:1.25rem}
body.sd .sd-list--news .sd-list__src{color:var(--sd-gray);font-size:.9rem}

/* Newsletter */
body.sd .sd-newsletter{max-width:720px;margin:0 auto;padding:clamp(4.5rem,9vw,7rem) var(--sd-gutter);text-align:center}
body.sd .sd-newsletter h2{font-size:clamp(2rem,2.5vw + 1rem,3rem);letter-spacing:-0.02em}
body.sd .sd-newsletter__text{margin:1rem 0 1.75rem;color:var(--sd-gray)}
body.sd .sd-newsletter__form{max-width:30rem;margin:0 auto}
body.sd .sd-newsletter input[type=email],body.sd .sd-newsletter input[type=text]{height:50px;padding:0 1rem;border:1px solid var(--sd-sand);border-radius:10px;background:var(--sd-white);font:inherit;color:var(--sd-black);width:100%}
body.sd .sd-newsletter button,body.sd .sd-newsletter input[type=submit]{height:50px;padding:0 1.4rem;border:0;border-radius:10px;background:var(--sd-black);color:var(--sd-cream);font:inherit;font-weight:600;cursor:pointer}
body.sd .sd-newsletter__hint{margin-top:.9rem;font-size:.85rem;color:var(--sd-gray)}

/* Footer */
body.sd .sd-footer{background:var(--sd-black);color:var(--sd-sand)}
body.sd .sd-footer__inner{padding-top:3rem;padding-bottom:2rem;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:2rem}
body.sd .sd-footer .sd-logo{font-size:2rem}
body.sd .sd-footer ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.25rem 2rem;font-size:.92rem}
body.sd .sd-footer ul a{color:var(--sd-cream);min-height:44px;display:inline-flex;align-items:center}
body.sd .sd-footer ul a:hover{color:var(--sd-green)}
body.sd .sd-footer__legal{flex:1 1 100%;margin-top:1rem;padding-top:1.25rem;border-top:1px solid var(--sd-gray);font-size:.85rem}

/* Inner pages */
body.sd .sd-page{padding:clamp(3rem,7vw,5rem) 0}
body.sd .sd-page__head{margin-bottom:2.5rem}
body.sd .sd-page__head h1{font-size:clamp(2.2rem,3vw + 1rem,3.6rem)}
body.sd .sd-page__head p{margin-top:.75rem;color:var(--sd-gray);max-width:40rem}
body.sd .sd-prose{max-width:720px}
body.sd .sd-prose>*+*{margin-top:1.1em}
body.sd .sd-prose h2{font-size:1.9rem;margin-top:1.8em}
body.sd .sd-prose h3{font-size:1.4rem;margin-top:1.6em}
body.sd .sd-prose a{text-decoration:underline;text-decoration-color:var(--sd-green);text-decoration-thickness:2px;text-underline-offset:3px}
body.sd .sd-prose img{border-radius:var(--sd-radius)}
body.sd .sd-posts{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:2rem 20px}
body.sd .sd-pagination{margin-top:3rem;display:flex;gap:.5rem;flex-wrap:wrap}
body.sd .sd-pagination .page-numbers{min-width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;border-radius:8px;background:var(--sd-white);padding:0 .75rem}
body.sd .sd-pagination .current{background:var(--sd-black);color:var(--sd-cream)}
body.sd .sd-filter{display:flex;gap:.5rem;overflow-x:auto;margin-bottom:2rem}
body.sd .sd-filter a{flex:none;min-height:44px;display:inline-flex;align-items:center;padding:0 1rem;border-radius:999px;border:1px solid var(--sd-sand);background:var(--sd-white);font-weight:500}
body.sd .sd-filter a.is-active{background:var(--sd-black);color:var(--sd-cream);border-color:var(--sd-black)}
body.sd .sd-empty{padding:2rem;border-radius:var(--sd-radius);background:var(--sd-white);color:var(--sd-gray)}
body.sd .sd-full-width{width:100%}

@media (max-width:600px){
  body.sd .sd-list:not(.sd-list--news) a{flex-direction:column;gap:.1rem}
  body.sd .sd-list:not(.sd-list--news) .sd-list__aside{text-align:left}
}
