/* ============================================================================
   FIERO CASA — CUSTOM PAGE STYLES
   fiero-pages.css
   ----------------------------------------------------------------------------
   1. UPLOAD
      Settings → Data → File Access (WebDAV) for the URL and credentials.
      Connect (Cyberduck, Finder "Connect to Server", or Map Network Drive)
      and drop this file into the /content/ folder.

      It is then publicly served at:
          https://fierocasa.com/content/fiero-pages.css
      Load that URL in a browser to confirm before going further.

   2. LINK IT — try these in order, stop at the first that sticks
      a) Page content. In the Acunto page's source-code view, put this as the
         very first line, above the <div class="fc-page">:
             <link rel="stylesheet" href="/content/fiero-pages.css">
         Save, reload, and view source. If the tag survived, you're done and
         you repeat that one line on each converted page.

      b) Theme file (reliable, does every page at once).
         Storefront → My Themes → your theme → ⋮ → Edit Theme Files
         Open  templates/layout/base.html
         Paste the same <link> line immediately before  </head>
         Save. On a marketplace theme this creates an editable copy first,
         which is expected.

      c) If you'd rather not carry a separate request: open
         assets/scss/theme.scss in the theme editor and paste the whole body
         of this file at the bottom. It is valid SCSS as written. Costs a
         theme rebuild on every edit, which is why it's the last option.

   3. UPDATING LATER
      /content/ is CDN-cached. After re-uploading a changed file, bump the
      query string on the link tag — href="/content/fiero-pages.css?v=2" — or
      you'll keep seeing the old one.

   SCOPE
   Everything is prefixed .fc-page, so this is inert on every page that
   doesn't use the markup. Reuse the same classes when you convert the
   Solfatara / Etna / Stromboli pages.

   NOTE
   The "Bake with Italian history" banner image is referenced from this file
   (search fc-banner), not from the page markup. It still points at the
   Shogun CDN — swap it when you re-host the images.
   ========================================================================= */

/* ===== Tokens ========================================================== */
.fc-page{
  /* palette */
  --fc-accent:#c9a882;          /* button / active tab tan */
  --fc-accent-dark:#b3906a;
  --fc-ink:#111111;             /* headings */
  --fc-body:#4a4a4a;            /* body copy */
  --fc-muted:#7d7d7d;
  --fc-rule:#e4e4e4;
  --fc-band:#f4f4f4;            /* grey section bands */
  /* type */
  --fc-head:"Montserrat","Helvetica Neue",Helvetica,Arial,sans-serif;
  --fc-text:"Open Sans","Helvetica Neue",Helvetica,Arial,sans-serif;
  /* layout */
  --fc-max:1200px;
  --fc-gap:60px;

  color:var(--fc-body);
  font-family:var(--fc-text);
  font-size:16px;
  line-height:1.75;
}
.fc-page *,.fc-page *::before,.fc-page *::after{box-sizing:border-box;}
.fc-page img{display:block;max-width:100%;height:auto;}
.fc-page p{margin:0 0 1.2em;}
.fc-page p:last-child{margin-bottom:0;}
.fc-page h1,.fc-page h2,.fc-page h3{
  font-family:var(--fc-head);
  color:var(--fc-ink);
  font-weight:600;
  line-height:1.25;
  margin:0 0 .7em;
  text-transform:none;
}
.fc-page a{color:inherit;}
.fc-page hr{border:0;border-top:1px solid var(--fc-rule);margin:28px 0;}
.fc-page .fc-wrap{max-width:var(--fc-max);margin:0 auto;padding:0 24px;}

/* Full-bleed helper. If the theme container clips it, or a horizontal
   scrollbar appears, delete the fc-bleed class from those two elements in
   the page markup. */
.fc-page .fc-bleed{
  width:100vw;
  max-width:100vw;
  margin-left:calc(50% - 50vw);
  margin-right:calc(50% - 50vw);
}

/* ===== Hero ============================================================ */
.fc-page .fc-hero{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:var(--fc-gap);
  align-items:center;
  padding:56px 24px 72px;
  max-width:var(--fc-max);
  margin:0 auto;
}

/* radio-driven gallery, no JS */
.fc-page .fc-gal-input,
.fc-page .fc-tab-input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none;}
.fc-page .fc-gallery{position:relative;}
.fc-page .fc-gallery__stage img{display:none;margin:0 auto;}
.fc-page .fc-gallery #fc-gal-1:checked ~ .fc-gallery__stage img[data-slide="1"],
.fc-page .fc-gallery #fc-gal-2:checked ~ .fc-gallery__stage img[data-slide="2"],
.fc-page .fc-gallery #fc-gal-3:checked ~ .fc-gallery__stage img[data-slide="3"]{display:block;}
.fc-page .fc-gallery__thumbs{display:flex;gap:12px;justify-content:center;margin-top:24px;}
.fc-page .fc-gallery__thumbs label{
  display:block;width:70px;padding:4px;cursor:pointer;margin:0;
  border:1px solid transparent;transition:border-color .2s ease;
}
.fc-page .fc-gallery__thumbs label:hover{border-color:var(--fc-rule);}
.fc-page .fc-gallery #fc-gal-1:checked ~ .fc-gallery__thumbs label[for="fc-gal-1"],
.fc-page .fc-gallery #fc-gal-2:checked ~ .fc-gallery__thumbs label[for="fc-gal-2"],
.fc-page .fc-gallery #fc-gal-3:checked ~ .fc-gallery__thumbs label[for="fc-gal-3"]{border-color:var(--fc-accent);}
.fc-page .fc-gallery #fc-gal-1:focus-visible ~ .fc-gallery__thumbs label[for="fc-gal-1"],
.fc-page .fc-gallery #fc-gal-2:focus-visible ~ .fc-gallery__thumbs label[for="fc-gal-2"],
.fc-page .fc-gallery #fc-gal-3:focus-visible ~ .fc-gallery__thumbs label[for="fc-gal-3"]{outline:2px solid var(--fc-accent);outline-offset:2px;}

.fc-page .fc-hero__title{
  font-size:clamp(2rem,4.2vw,3rem);
  letter-spacing:.06em;
  text-transform:uppercase;
  margin-bottom:.25em;
}
.fc-page .fc-price{
  font-family:var(--fc-head);
  font-size:.875rem;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--fc-ink);
  margin:0;
}
.fc-page .fc-hero__desc{font-size:.9375rem;max-width:60ch;}
.fc-page .fc-fuel{font-family:var(--fc-head);font-size:.875rem;font-weight:600;color:var(--fc-ink);}
.fc-page .fc-btn{
  display:block;
  width:100%;
  padding:18px 24px;
  background:var(--fc-accent);
  color:#fff;
  font-family:var(--fc-head);
  font-size:.8125rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  text-align:center;
  text-decoration:none;
  transition:background-color .2s ease;
}
.fc-page .fc-btn:hover,.fc-page .fc-btn:focus{background:var(--fc-accent-dark);color:#fff;}

/* ===== Grey heading band =============================================== */
.fc-page .fc-band{background:var(--fc-band);padding:44px 24px;text-align:center;}
.fc-page .fc-band h2{
  font-size:1.375rem;letter-spacing:.2em;text-transform:uppercase;margin:0;font-weight:500;
}

/* ===== Tabs (CSS only) ================================================= */
.fc-page .fc-tablist{display:grid;grid-template-columns:repeat(2,1fr);background:var(--fc-band);}
.fc-page .fc-tablist label{
  padding:20px 12px;
  text-align:center;
  cursor:pointer;
  margin:0;
  font-family:var(--fc-head);
  font-size:.8125rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--fc-muted);
  border-bottom:1px solid var(--fc-rule);
  transition:background-color .2s ease,color .2s ease;
}
.fc-page .fc-tablist label:hover{color:var(--fc-ink);}
.fc-page .fc-panel{display:none;}
.fc-page #fc-tab-features:checked  ~ #fc-panel-features,
.fc-page #fc-tab-technical:checked ~ #fc-panel-technical{display:block;}
.fc-page #fc-tab-features:checked  ~ .fc-tablist label[for="fc-tab-features"],
.fc-page #fc-tab-technical:checked ~ .fc-tablist label[for="fc-tab-technical"]{
  background:#fff;color:var(--fc-ink);border-bottom:2px solid var(--fc-accent);
}
.fc-page #fc-tab-features:focus-visible  ~ .fc-tablist label[for="fc-tab-features"],
.fc-page #fc-tab-technical:focus-visible ~ .fc-tablist label[for="fc-tab-technical"]{
  outline:2px solid var(--fc-accent);outline-offset:-4px;
}

/* model sub-tabs */
.fc-page .fc-subtabs{margin-top:8px;}
.fc-page .fc-subtablist{display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid var(--fc-rule);}
.fc-page .fc-subtablist label{
  padding:16px 8px;text-align:center;cursor:pointer;margin:0;
  font-family:var(--fc-head);font-size:.75rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--fc-muted);
  transition:color .2s ease,box-shadow .2s ease;
}
.fc-page .fc-subtablist label:hover{color:var(--fc-ink);}
.fc-page .fc-subpanel{display:none;padding-top:44px;}
.fc-page #fc-model-angolare:checked ~ #fc-panel-angolare,
.fc-page #fc-model-circolare:checked ~ #fc-panel-circolare,
.fc-page #fc-model-vesuvio:checked  ~ #fc-panel-vesuvio{display:block;}
.fc-page #fc-model-angolare:checked ~ .fc-subtablist label[for="fc-model-angolare"],
.fc-page #fc-model-circolare:checked ~ .fc-subtablist label[for="fc-model-circolare"],
.fc-page #fc-model-vesuvio:checked  ~ .fc-subtablist label[for="fc-model-vesuvio"]{
  color:var(--fc-ink);box-shadow:inset 0 -2px 0 var(--fc-accent);
}
.fc-page #fc-model-angolare:focus-visible ~ .fc-subtablist label[for="fc-model-angolare"],
.fc-page #fc-model-circolare:focus-visible ~ .fc-subtablist label[for="fc-model-circolare"],
.fc-page #fc-model-vesuvio:focus-visible  ~ .fc-subtablist label[for="fc-model-vesuvio"]{
  outline:2px solid var(--fc-accent);outline-offset:-4px;
}

/* ===== Alternating feature rows ======================================== */
.fc-page .fc-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:var(--fc-gap);
  align-items:center;
  padding:64px 0;
}
.fc-page .fc-row + .fc-row{padding-top:0;}
.fc-page .fc-row--flip .fc-row__media{order:-1;}
.fc-page .fc-row h3{
  font-size:1.25rem;letter-spacing:.12em;text-transform:uppercase;margin-bottom:1em;
}
.fc-page .fc-row p{font-size:.9375rem;max-width:56ch;}
.fc-page .fc-mark{max-width:96px;margin-top:32px;opacity:.85;}

/* ===== Italian history banner ========================================== */
.fc-page .fc-banner{
  position:relative;
  min-height:420px;
  display:grid;
  place-items:center;
  text-align:center;
  background:#2b2b2b center/cover no-repeat;
  background-image:url("https://i.shgcdn.com/4c9c6b17-0a8e-4ac6-93a6-f9fd776be798/-/format/auto/-/preview/2000x2000/-/quality/lighter/");
}
.fc-page .fc-banner::before{content:"";position:absolute;inset:0;background:rgba(0,0,0,.38);}
.fc-page .fc-banner__inner{position:relative;padding:96px 24px;}
.fc-page .fc-banner__icon{display:block;width:34px;height:34px;margin:0 auto 22px;fill:#fff;opacity:.9;}
.fc-page .fc-banner h2{
  color:#fff;margin:0;font-weight:500;
  font-size:clamp(1.5rem,3.4vw,2.375rem);
  letter-spacing:.2em;text-transform:uppercase;
}

/* ===== Technical ======================================================= */
.fc-page .fc-tech{padding:64px 0;}
.fc-page .fc-split{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:var(--fc-gap);align-items:center;
}
.fc-page .fc-tech h3{font-size:1.125rem;letter-spacing:.14em;text-transform:uppercase;}
.fc-page .fc-fine{font-size:.8125rem;line-height:1.65;}
.fc-page .fc-fine strong{color:var(--fc-ink);}
.fc-page .fc-figure{margin:0;}
.fc-page .fc-figcaption{
  font-family:var(--fc-head);font-size:.75rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--fc-ink);text-align:center;margin-top:14px;font-style:normal;
}

.fc-page .fc-specs{width:100%;border-collapse:collapse;font-size:.875rem;margin:8px 0 0;}
.fc-page .fc-specs th,.fc-page .fc-specs td{
  padding:14px 0;border-bottom:1px solid var(--fc-rule);text-align:left;background:none;
}
.fc-page .fc-specs th{font-weight:400;color:var(--fc-body);width:48%;}
.fc-page .fc-specs td{font-family:var(--fc-head);font-weight:600;color:var(--fc-ink);}

.fc-page .fc-heading-sep{margin-top:56px;}
.fc-page .fc-downloads{display:flex;flex-wrap:wrap;gap:18px;margin-top:8px;}
.fc-page .fc-dl{
  display:flex;align-items:center;gap:14px;
  padding:14px 20px;min-width:250px;
  border:1px solid var(--fc-rule);text-decoration:none;
  transition:border-color .2s ease,background-color .2s ease;
}
.fc-page .fc-dl:hover,.fc-page .fc-dl:focus{border-color:var(--fc-accent);background:#fbf8f4;}
.fc-page .fc-dl svg{width:26px;height:26px;flex:none;fill:var(--fc-accent);}
.fc-page .fc-dl__eyebrow{
  display:block;font-family:var(--fc-head);font-size:.6875rem;
  letter-spacing:.1em;color:#666;
}
.fc-page .fc-dl__label{
  display:block;font-family:var(--fc-head);font-size:.75rem;font-weight:700;
  letter-spacing:.1em;color:var(--fc-ink);
}

/* ===== Related ovens =================================================== */
.fc-page .fc-related{padding:72px 0 88px;text-align:center;}
.fc-page .fc-related h2{font-size:1.5rem;letter-spacing:.16em;margin-bottom:.4em;text-transform:uppercase;}
.fc-page .fc-related__sub{
  font-family:var(--fc-head);font-size:.8125rem;letter-spacing:.12em;
  text-transform:uppercase;color:#666;margin:0;
}
.fc-page .fc-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:44px;}
.fc-page .fc-card{position:relative;display:block;overflow:hidden;text-decoration:none;}
.fc-page .fc-card img{width:100%;aspect-ratio:3/4;object-fit:cover;transition:transform .6s ease;}
.fc-page .fc-card:hover img,.fc-page .fc-card:focus img{transform:scale(1.05);}
.fc-page .fc-card__overlay{
  position:absolute;inset:0;display:grid;align-content:center;
  padding:24px;background:rgba(0,0,0,.28);color:#fff;
}
.fc-page .fc-card__title{
  font-family:var(--fc-head);font-size:1.5rem;letter-spacing:.12em;
  text-transform:uppercase;color:#fff;margin:0 0 6px;
}
.fc-page .fc-card__sub{font-family:var(--fc-head);font-size:.8125rem;letter-spacing:.16em;margin:0;}

/* ===== Responsive ====================================================== */
@media (max-width:900px){
  .fc-page{--fc-gap:36px;}
  .fc-page .fc-hero{grid-template-columns:1fr;padding:32px 24px 48px;}
  .fc-page .fc-row,.fc-page .fc-split{grid-template-columns:1fr;}
  .fc-page .fc-row{padding:44px 0;}
  .fc-page .fc-row--flip .fc-row__media{order:0;}
  .fc-page .fc-cards{grid-template-columns:1fr;gap:16px;}
  .fc-page .fc-card img{aspect-ratio:16/9;}
  .fc-page .fc-banner{min-height:300px;}
  .fc-page .fc-banner__inner{padding:64px 24px;}
  .fc-page .fc-tablist label{padding:16px 8px;letter-spacing:.1em;}
  .fc-page .fc-subtablist label{padding:14px 4px;letter-spacing:.08em;font-size:.6875rem;}
  .fc-page .fc-dl{min-width:0;width:100%;}
}
@media (prefers-reduced-motion:reduce){
  .fc-page *{transition:none !important;}
}
