/* ============================================================================
   Costruire SRL - il riquadro dello showroom partner (Residenza Gli Orti).

   Com'era: un rettangolo squadrato con un quadrato d'oro pieno a sinistra,
   il titolo a 22px e il testo grigio a 14px. Leggibile, ma somigliava a un
   avviso piu' che a un partner scelto.

   Com'e': carta scura leggermente in rilievo, filo d'oro sul bordo sinistro,
   il nome grande nel carattere dei titoli, il marchio in un tondo con bordo
   d'oro invece che in un quadrato pieno. Piu' aria, piu' gerarchia.
   ========================================================================= */

.orti-showroom-box{
    position: relative;
    margin-bottom: 38px;
    padding: 34px 36px 34px 40px;
    grid-template-columns: 66px 1fr;
    gap: 26px;
    align-items: start;
    border-radius: 4px;
    border: 1px solid rgba(201, 164, 92, .22);
    background:
        linear-gradient(135deg, rgba(201, 164, 92, .10) 0%, rgba(201, 164, 92, 0) 46%),
        rgba(255, 255, 255, .035);
    box-shadow:
        0 1px 0 rgba(255, 255, 255, .05) inset,
        0 24px 60px rgba(0, 0, 0, .30);
    overflow: hidden;
}

/* il filo d'oro sul bordo sinistro: e' il dettaglio che lo fa sembrare scelto */
.orti-showroom-box::before{
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 3px;
    background: linear-gradient(to bottom,
        var(--primary, #c9a45c) 0%,
        rgba(201, 164, 92, .35) 62%,
        rgba(201, 164, 92, 0) 100%);
}

/* il marchio in un tondo con bordo d'oro, non piu' un quadrato pieno */
.orti-showroom-box .orti-showroom-icon{
    width: 62px;
    height: 62px;
    border-radius: 50%;
    background: transparent;
    border: 1px solid rgba(201, 164, 92, .45);
    color: var(--primary, #c9a45c);
    font-size: 21px;
    box-shadow: 0 0 0 6px rgba(201, 164, 92, .06);
}

.orti-showroom-box span{
    margin-bottom: 12px;
    color: var(--primary, #c9a45c);
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: .26em;
    text-transform: uppercase;
}

.orti-showroom-box h3{
    margin: 0 0 14px;
    color: #f4f0e7;
    font-family: var(--font-heading, Manrope, sans-serif);
    font-size: clamp(1.7rem, 2.6vw, 2.1rem);
    font-weight: 800;
    letter-spacing: -.03em;
    line-height: 1.05;
}

.orti-showroom-box p{
    margin: 0;
    color: rgba(244, 240, 231, .74);
    font-size: 15px;
    line-height: 1.72;
    max-width: 46ch;
}

@media (max-width: 620px){
    .orti-showroom-box{
        grid-template-columns: 1fr;
        padding: 28px 24px 28px 28px;
        gap: 20px;
    }
}

/* ============================================================================
   La sezione "Materiali e finiture" dopo la rimozione delle quattro schede.

   Era una griglia a due colonne: testo a sinistra, quattro schede a destra.
   Tolte le schede, restava una colonna sola spinta a sinistra e meta' sezione
   vuota. Qui la rifaccio a colonna unica centrata, con piu' aria: il titolo,
   il testo, il riquadro dello showroom e il bottone in asse, uno sotto
   l'altro. Nessuna griglia da riempire, quindi niente vuoti.
   ========================================================================= */

.orti-specifications-grid{
    grid-template-columns: 1fr;
    gap: 0;
    justify-items: center;
    text-align: center;
}

.orti-specifications-content{
    max-width: 720px;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.orti-specifications-content .section-subtitle{
    margin-bottom: 20px;
}

.orti-specifications-content h2{
    max-width: 16ch;
    margin-inline: auto;
}

.orti-specifications-intro{
    max-width: 56ch;
    margin: 26px auto 44px;
    font-size: 18px;
}

/* il riquadro dello showroom diventa il centro della sezione */
.orti-specifications-content .orti-showroom-box{
    width: 100%;
    max-width: 620px;
    margin: 0 auto 40px;
    text-align: left;
}

/* un filetto d'oro sopra il bottone: separa senza aggiungere rumore */
.orti-specifications-content .orti-specifications-button{
    position: relative;
    margin-top: 8px;
}
.orti-specifications-content .orti-specifications-button::before{
    content: "";
    position: absolute;
    left: 50%;
    top: -40px;
    width: 1px;
    height: 24px;
    background: linear-gradient(to bottom, rgba(201,164,92,0), var(--primary, #c9a45c));
}

@media (max-width: 700px){
    .orti-specifications-content .orti-showroom-box{ max-width: 100% }
    .orti-specifications-intro{ font-size: 16px; margin-bottom: 34px }
}