/* TiRifoCasa — colori e struttura base per Cassiopeia
   Versione 1: la tipografia verrà definita separatamente. */

:root {
  --tirifo-verde: #243d38;
  --tirifo-salvia: #879681;
  --tirifo-argilla: #a97563;
  --tirifo-ottone: #ad956d;
  --tirifo-calce: #fcfbf7;
  --tirifo-testo: #2d3835;
  --tirifo-testo-morbido: #68655f;
  --tirifo-linea: #d8d5ca;

  /* Variabili native di Cassiopeia */
  --cassiopeia-color-primary: var(--tirifo-verde);
  --cassiopeia-color-link: #8b5949;
  --cassiopeia-color-hover: #6f463a;
}

/* Pagina */
body {
  color: var(--tirifo-testo);
  background: var(--tirifo-calce);
}

/* Intestazione: elimina il gradiente blu di Cassiopeia */
.container-header {
  color: var(--tirifo-calce);
  background-color: var(--tirifo-verde);
  background-image: none;
  box-shadow: none;
}

/* Menu compatto sopra il marchio */
.container-header .container-nav {
  padding-block: 0.2rem;
}

.container-header .mod-menu {
  color: var(--tirifo-calce);
}

.container-header .mod-menu a {
  color: var(--tirifo-calce);
  text-decoration-color: transparent;
  text-underline-offset: 0.35rem;
  transition: color 160ms ease, text-decoration-color 160ms ease;
}

.container-header .mod-menu a:hover,
.container-header .mod-menu a:focus,
.container-header .mod-menu .active > a,
.container-header .mod-menu .current > a {
  color: #d7c8ad;
  text-decoration-color: var(--tirifo-argilla);
}

/* Marchio: riduce il grande vuoto verticale dello screenshot */
.container-header .navbar-brand {
  width: min(100%, 52rem);
  margin-inline: auto;
  padding-block: clamp(1.1rem, 2.5vw, 2.1rem);
}

.container-header .navbar-brand img {
  display: block;
  width: min(100%, 46rem);
  height: auto;
  margin-inline: auto;
}

/* Il payoff è già incluso nel logo */
.container-header .site-description {
  display: none;
}

/* Area principale */
.site-grid {
  background: var(--tirifo-calce);
}

.grid-child.container-component {
  padding-block-start: clamp(1rem, 2vw, 1.75rem);
}

/* Breadcrumb più discreto e coerente */
.breadcrumb {
  color: var(--tirifo-testo-morbido);
  background: #f2f0e9;
  border-inline-start: 3px solid var(--tirifo-salvia);
  border-radius: 0;
}

.breadcrumb a {
  color: #6f5147;
}

/* Link */
a:not(.btn):not(.brand-logo) {
  color: #875848;
  text-decoration-color: color-mix(in srgb, var(--tirifo-argilla) 45%, transparent);
  text-underline-offset: 0.18em;
}

a:not(.btn):not(.brand-logo):hover,
a:not(.btn):not(.brand-logo):focus {
  color: #684239;
  text-decoration-color: currentColor;
}

/* Separatori e bordi editoriali */
hr,
.item-content,
.blog-item,
.com-content-article {
  border-color: var(--tirifo-linea);
}

/* Pulsanti e Read more */
.btn-primary,
.readmore .btn,
.com-contact__form .btn-primary {
  color: var(--tirifo-calce);
  background-color: var(--tirifo-argilla);
  border-color: var(--tirifo-argilla);
  border-radius: 0.2rem;
  box-shadow: none;
}

.btn-primary:hover,
.btn-primary:focus,
.readmore .btn:hover,
.readmore .btn:focus,
.com-contact__form .btn-primary:hover,
.com-contact__form .btn-primary:focus {
  color: var(--tirifo-calce);
  background-color: #8f5f50;
  border-color: #8f5f50;
}

/* Etichette/tag degli articoli: niente blu Cassiopeia */
.tags .btn,
.tag-category .btn,
.badge,
.label-info {
  color: var(--tirifo-verde);
  background: #dfe4dc;
  border-color: transparent;
}

/* Campi del modulo contatti */
.form-control:focus,
.form-select:focus {
  border-color: var(--tirifo-salvia);
  box-shadow: 0 0 0 0.2rem rgb(135 150 129 / 22%);
}

/* Piè di pagina */
.container-footer,
.footer {
  color: #e4e2da;
  background-color: var(--tirifo-verde);
  background-image: none;
}

.container-footer a,
.footer a {
  color: var(--tirifo-calce);
}

/* Menu mobile */
.container-header .navbar-toggler {
  color: var(--tirifo-calce);
  border-color: rgb(252 251 247 / 55%);
}

/* Fallback per browser che non supportano color-mix */
@supports not (color: color-mix(in srgb, red 50%, white)) {
  a:not(.btn):not(.brand-logo) {
    text-decoration-color: #c7a59a;
  }
}

@media (max-width: 767.98px) {
  .container-header .navbar-brand {
    padding-block: 0.9rem 1.2rem;
  }

  .container-header .navbar-brand img {
    width: min(100%, 34rem);
  }
}

/* Convert Forms — messaggio di successo */
.convertforms .cf-response {
  color: #fcfbf7 !important;
  background-color: #243d38 !important;
}

.convertforms .cf-response p,
.convertforms .cf-response a,
.convertforms .cf-response span {
  color: #fcfbf7 !important;
}

/* TiRifoCasa — sistema tipografico definitivo
   Titoli: Cabin 400/500 | Testi e interfaccia: IBM Plex Sans 400/500/600
   Copiare in fondo a media/css/user.css.
   Copiare i file .woff2 in media/fonts/ del child template. */

@font-face {
  font-family: "Cabin";
  src: url("../fonts/cabin-latin-400-normal.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "Cabin";
  src: url("../fonts/cabin-latin-500-normal.woff2") format("woff2");
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}

@font-face {
  font-family: "IBM Plex Sans";
  src: url("../fonts/ibm-plex-sans-latin-400-normal.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "IBM Plex Sans";
  src: url("../fonts/ibm-plex-sans-latin-500-normal.woff2") format("woff2");
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}

@font-face {
  font-family: "IBM Plex Sans";
  src: url("../fonts/ibm-plex-sans-latin-600-normal.woff2") format("woff2");
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}

:root {
  --tirifo-font-title: "Cabin", "Segoe UI", Arial, sans-serif;
  --tirifo-font-text: "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif;
}

/* Testo corrente */
body {
  font-family: var(--tirifo-font-text);
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.62;
  letter-spacing: 0;
}

/* Titoli */
h1,
h2,
h3,
.h1,
.h2,
.h3,
.page-header,
.item-title,
.card-title {
  font-family: var(--tirifo-font-title);
  color: var(--tirifo-verde, #243d38);
  font-weight: 400;
  line-height: 1.18;
  letter-spacing: -0.018em;
  text-wrap: balance;
}

h1,
.h1,
.page-header h1 {
  margin-block: 0 0.72em;
  font-size: clamp(2.15rem, 4vw, 3.35rem);
}

h2,
.h2,
.item-title {
  margin-block: 1.25em 0.48em;
  font-size: clamp(1.65rem, 2.7vw, 2.25rem);
}

h3,
.h3 {
  margin-block: 1.15em 0.42em;
  font-size: clamp(1.3rem, 2vw, 1.65rem);
}

/* Titoli minori: leggermente più presenti */
h4,
h5,
h6,
.h4,
.h5,
.h6 {
  font-family: var(--tirifo-font-title);
  color: var(--tirifo-verde, #243d38);
  font-weight: 500;
  line-height: 1.28;
}

h4,
.h4 {
  margin-block: 1.1em 0.4em;
  font-size: 1.14rem;
}

p,
ul,
ol {
  margin-block-start: 0;
  margin-block-end: 1.05rem;
}

/* Enfasi controllata */
strong,
b {
  font-weight: 600;
}

/* Articoli */
.com-content-article,
.com-content-category-blog .blog-item,
.item-page {
  font-size: clamp(1rem, 0.25vw + 0.94rem, 1.075rem);
}

.com-content-article p,
.item-page p {
  max-width: 72ch;
}

/* Menu */
.container-header .mod-menu {
  font-family: var(--tirifo-font-text);
  font-size: 0.93rem;
  font-weight: 400;
  line-height: 1.25;
  letter-spacing: 0.01em;
}

/* Breadcrumb, metadati e tag */
.breadcrumb,
.article-info,
.article-info-term,
.tags,
.small,
small {
  font-family: var(--tirifo-font-text);
  font-size: 0.84rem;
  font-weight: 400;
  line-height: 1.45;
}

/* Pulsanti e azioni */
.btn,
button,
input[type="submit"] {
  font-family: var(--tirifo-font-text);
  font-size: 0.95rem;
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: 0.012em;
}

/* Moduli Joomla e Convert Forms */
label,
.form-label,
.convertforms label {
  font-family: var(--tirifo-font-text);
  font-weight: 500;
}

input,
textarea,
select,
.form-control,
.convertforms input,
.convertforms textarea,
.convertforms select {
  font-family: var(--tirifo-font-text);
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
}

/* Il messaggio sul verde richiede il Medium 500 */
.convertforms .cf-response,
.convertforms .cf-response p,
.convertforms .cf-response a,
.convertforms .cf-response span,
.container-footer,
.footer {
  font-family: var(--tirifo-font-text);
  font-weight: 500;
}

/* Griglia Idee per casa */
.blog-items .item-title,
.blog-items h2,
.blog-items h3 {
  font-size: clamp(1.35rem, 2vw, 1.82rem);
  line-height: 1.2;
}

.readmore {
  margin-block-start: 1.15rem;
}

@media (max-width: 767.98px) {
  body {
    font-size: 0.98rem;
    line-height: 1.58;
  }

  h1,
  .h1,
  .page-header h1 {
    font-size: 2rem;
  }

  h2,
  .h2,
  .item-title {
    font-size: 1.55rem;
  }

  .container-header .mod-menu {
    font-size: 1rem;
    line-height: 1.4;
  }
}

/* Separatori editoriali */
hr {
  width: 100%;
  height: 1px;
  margin: 2.25rem 0;
  color: #ad956d;
  background-color: #ad956d;
  border: 0;
  opacity: 0.65;
}

/* Nasconde il titolo articolo soltanto nella home */
body.itemid-101 .com-content-article > .page-header {
  display: none;
}

/* FAQ a fisarmonica */
.tirifo-faq {
  max-width: 960px;
  margin-block: 2rem;
  border-top: 1px solid #ad956d;
}

.tirifo-faq details {
  border-bottom: 1px solid #ad956d;
}

.tirifo-faq summary {
  position: relative;
  padding: 1.15rem 3rem 1.15rem 0;
  color: #243d38;
  font-family: var(--tirifo-font-title);
  font-size: clamp(1.1rem, 1.5vw, 1.3rem);
  font-weight: 500;
  line-height: 1.3;
  cursor: pointer;
  list-style: none;
}

.tirifo-faq summary::-webkit-details-marker {
  display: none;
}

.tirifo-faq summary::after {
  position: absolute;
  top: 50%;
  right: 0.25rem;
  content: "+";
  color: #a97563;
  font-family: var(--tirifo-font-text);
  font-size: 1.6rem;
  font-weight: 400;
  line-height: 1;
  transform: translateY(-50%);
}

.tirifo-faq details[open] summary::after {
  content: "−";
}

.tirifo-faq summary:hover,
.tirifo-faq summary:focus-visible {
  color: #875848;
}

.tirifo-faq summary:focus-visible {
  outline: 2px solid #879681;
  outline-offset: 4px;
}

.tirifo-faq-answer {
  max-width: 72ch;
  padding: 0 2rem 1.35rem 0;
  color: #2d3835;
}

.tirifo-faq-answer p:last-child {
  margin-bottom: 0;
}

#mod-custom111 a.footer-assist-link {
    color: #C89B42 !important;
}

#mod-custom111 a.footer-assist-link:hover,
#mod-custom111 a.footer-assist-link:focus {
    color: #ffffff !important;
}

/* Main menu — allineamento desktop e hover ocra
   Override finale: resta in fondo al file per prevalere sulle regole generali dei link. */
@media (min-width: 768px) {
  .container-header .container-nav {
    justify-content: flex-end;
  }

  .container-header .mod-menu {
    margin-inline-start: auto;
    justify-content: flex-end;
  }
}

.container-header .mod-menu a:hover,
.container-header .mod-menu a:focus {
  color: var(--tirifo-ottone) !important;
  text-decoration-color: currentColor;
}

blockquote {
    margin: 2rem 0 !important;
    padding: 1.5rem !important;
    border-left: 5px solid var(--tirifo-ottone) !important;
    background-color: #eef1ec !important;
    color: var(--tirifo-testo) !important;
}