/* OFFSET demonstration links: intentionally neutral to contrast the colorful demos. */
.styles-grid{align-items:start}
.style-item{min-width:0;border:1px solid #e2e8ee;border-radius:13px;overflow:hidden;background:#fff;box-shadow:0 5px 20px #1d2d3e0a}
.style-item>.style-card{display:block;width:100%;border:0;border-radius:0;box-shadow:none;background:#fff}
.style-item>.style-card:hover{box-shadow:none;transform:none}
.style-item .style-visual{height:235px}
.style-item .card-caption{padding:16px 17px!important}
.style-item .card-caption b{font-weight:800}
.example-panel{border-top:1px solid #e5eaf0;padding:14px 14px 17px;background:#fbfcfe;display:grid;gap:13px}
.example-heading{display:flex;justify-content:space-between;gap:12px;align-items:center;color:#53718a;font-size:10px;letter-spacing:.09em}
.example-heading span{font-size:10px;color:#8b97a2;letter-spacing:0}
.example-link{display:block;overflow:hidden;border:1px solid #e0e5eb;background:#fff;border-radius:9px;text-decoration:none;transition:transform .2s,box-shadow .2s}
.example-link:hover{transform:translateY(-3px);box-shadow:0 10px 23px #253d521b}
.example-link:focus-visible{outline:3px solid #6787a2;outline-offset:2px}
.example-shot{display:block;aspect-ratio:1.88;overflow:hidden;background:#e9edf1;border-bottom:1px solid #e5e9ed}
.example-shot img{display:block;width:100%;height:100%;object-fit:cover;object-position:top;transition:transform .3s}
.example-link:hover .example-shot img{transform:scale(1.025)}
.example-info{display:flex;flex-direction:column;gap:5px;padding:12px 13px 14px;color:#253447}
.example-info strong{font-size:15px;font-weight:800;display:flex;justify-content:space-between;align-items:center;gap:12px;letter-spacing:-.02em}
.example-info strong span{font-size:19px;color:#5c7e9d}
.example-info small{font-size:12px;color:#5b6a79;line-height:1.4}
.example-features{font-size:10px;color:#7c8794;line-height:1.4}
@media(max-width:1100px){.style-item .style-visual{height:220px}.example-panel{padding:11px;gap:10px}.example-info{padding:12px}}
@media(max-width:800px){.style-item .style-visual{height:255px}}
@media(max-width:570px){.style-item .style-visual{height:245px}.example-shot{aspect-ratio:2.05}.example-info strong{font-size:16px}.example-info small{font-size:12px}}

/* REAL PHOTOGRAPHIC PORTFOLIO COVERS */
.photo-example{position:relative;background:#777;isolation:isolate}
.photo-example::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(7,6,5,.72),transparent 80%);z-index:1;pointer-events:none}
.example-photo-brand{position:absolute;bottom:0;left:0;right:0;z-index:2;color:white;display:flex;flex-direction:column;gap:5px;padding:22px 18px;pointer-events:none}
.example-photo-brand strong{font-family:Georgia,serif;font-weight:400;font-size:clamp(27px,3.1vw,39px);line-height:1;letter-spacing:-.055em}
.example-photo-brand small{font-size:9px;font-weight:600;letter-spacing:.21em}
.example-shot.photo-example img{object-fit:cover;object-position:center;height:100%}

/* Shared example gallery keeps uneven category counts from creating trailing cards. */
.portfolio-gallery{margin-top:48px}
.portfolio-gallery-title{font-size:clamp(25px,3vw,36px);letter-spacing:-.035em;margin:0 0 24px;color:#253447}
.portfolio-examples-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;align-items:stretch}
.portfolio-examples-grid .example-link{min-width:0;display:flex;flex-direction:column}
.portfolio-examples-grid .example-info{flex:1;padding:17px 18px 19px}
.example-style-label{font-size:10px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:#53718a;margin-bottom:4px}
@media(max-width:800px){.portfolio-examples-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}}
@media(max-width:570px){.portfolio-examples-grid{grid-template-columns:1fr;gap:18px}.portfolio-gallery{margin-top:32px}}

/* Keep each demo under its own style, with the gourmet pair in a shared row. */
.gourmet-category{grid-column:1/-1}
.gourmet-category-heading{padding:27px 25px;background:#fff;color:#521c2a;border-top:4px solid #701e35}
.gourmet-category-heading h3{font:600 clamp(25px,3vw,36px)/1.2 Georgia,serif;letter-spacing:-.035em;margin:0 0 10px}
.gourmet-category-heading p{font-size:13px;line-height:1.7;margin:0;color:#765c64}
.gourmet-category .example-panel{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;padding:20px;background:#fbf8f9}
.gourmet-category .example-heading{grid-column:1/-1}
.gourmet-category .example-shot{aspect-ratio:2.15}
@media(max-width:570px){.gourmet-category .example-panel{grid-template-columns:1fr;padding:14px}.gourmet-category-heading{padding:22px 18px}}

/* Every portfolio category uses the same full-width section layout. */
.styles-grid{grid-template-columns:minmax(0,1fr);gap:30px}
.style-category{grid-column:1/-1}
.style-category-heading{padding:27px 25px;background:#fff;color:#253447;border-top:4px solid #6787a2}
.style-category-heading h3{font:600 clamp(25px,3vw,36px)/1.2 Georgia,serif;letter-spacing:-.035em;margin:0 0 10px}
.style-category-heading p{font-size:13px;line-height:1.7;margin:0;color:#5b6a79}
.style-category .example-panel{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;padding:20px;background:#fbfcfe}
.style-category .example-heading{grid-column:1/-1}
.style-category .example-shot{aspect-ratio:2.15}
.style-category .example-link{min-width:0}
.style-category .example-panel.single-example{grid-template-columns:minmax(0,1fr)}
.style-category .single-example .example-link{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);align-items:stretch}
.style-category .single-example .example-shot{border-bottom:0;border-right:1px solid #e5e9ed}
.style-category .single-example .example-info{justify-content:center;padding:28px;gap:12px}
.style-category .single-example .example-info>strong{font-size:25px}
.style-category .single-example .example-info>small{font-size:14px}
.style-category .single-example .example-features{font-size:12px}
.gourmet-category .style-category-heading{color:#521c2a;border-top-color:#701e35}
.gourmet-category .example-panel{background:#fbf8f9}
@media(max-width:570px){.styles-grid{gap:24px}.style-category .example-panel{grid-template-columns:1fr;padding:14px}.style-category-heading{padding:22px 18px}.style-category .single-example .example-link{display:block}.style-category .single-example .example-shot{border-right:0;border-bottom:1px solid #e5e9ed}.style-category .single-example .example-info{padding:18px;gap:7px}.style-category .single-example .example-info>strong{font-size:20px}}

/* Distinct typography and colour for each portfolio category. */
.style-category .style-category-heading{border-top-color:var(--category-color);background:var(--category-bg)}
.style-category .style-category-heading h3{color:var(--category-color);font-family:var(--category-font);font-weight:var(--category-weight,600);font-style:var(--category-style,normal);font-size:clamp(28px,3.2vw,42px);letter-spacing:var(--category-spacing,-.025em);line-height:1.22;overflow-wrap:break-word}
.style-category .style-category-heading p{color:var(--category-color);opacity:1}
.style-category .example-style-label{color:var(--category-color)}
.style-category[data-style="elegante"]{--category-color:#705026;--category-bg:#fcf9f2;--category-font:'Cormorant Garamond',Georgia,serif;--category-weight:600;--category-style:italic;--category-spacing:.015em}
.style-category[data-style="lusso"]{--category-color:#53416f;--category-bg:#faf7fc;--category-font:'Cinzel',Georgia,serif;--category-weight:500;--category-spacing:.035em}
.style-category[data-style="professionale"]{--category-color:#20446a;--category-bg:#f4f8fc;--category-font:'IBM Plex Sans',Arial,sans-serif;--category-weight:600;--category-spacing:-.035em}
.style-category[data-style="creativo"]{--category-color:#ad3821;--category-bg:#fff5ee;--category-font:'Fredoka','Arial Rounded MT Bold',sans-serif;--category-weight:700;--category-spacing:-.025em}
.style-category[data-style="moderno"]{--category-color:#12656a;--category-bg:#f0f9f8;--category-font:'Space Grotesk',Arial,sans-serif;--category-weight:600;--category-spacing:-.055em}
.style-category[data-style="naturale"]{--category-color:#436344;--category-bg:#f5f9f1;--category-font:'Lora',Georgia,serif;--category-weight:500;--category-style:italic;--category-spacing:-.035em}
.style-category[data-style="gourmet"]{--category-color:#701e35;--category-bg:#fff;--category-font:Georgia,serif;--category-weight:600;--category-spacing:-.035em}

/* One full-width category per row; consistent vertical website cards beneath. */
.styles-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:30px}
.styles-grid>.style-category{grid-column:1/-1;width:100%;min-width:0}
.style-category .example-panel,.style-category .example-panel.single-example{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;padding:20px}
.style-category .example-heading{grid-column:1/-1}
.style-category .example-link,.style-category .single-example .example-link{display:flex;flex-direction:column;min-width:0;align-items:stretch}
.style-category .example-shot,.style-category .single-example .example-shot{display:block;width:100%;aspect-ratio:2.15;border-right:0;border-bottom:1px solid #e5e9ed}
.style-category .example-info,.style-category .single-example .example-info{display:flex;flex-direction:column;justify-content:flex-start;padding:18px 20px;gap:7px;flex:1}
.style-category .example-info>strong,.style-category .single-example .example-info>strong{font-size:20px}
.style-category .example-info>small,.style-category .single-example .example-info>small{font-size:13px}
.style-category .example-features,.style-category .single-example .example-features{font-size:11px}
@media(max-width:570px){.styles-grid{grid-template-columns:minmax(0,1fr);gap:24px}.style-category .example-panel,.style-category .example-panel.single-example{grid-template-columns:minmax(0,1fr);padding:14px;gap:16px}}