/* ════════════════════════════════════════════════════════════════ site.css — toate stilurile site-ului iuliancetanas.com, într-un singur fișier Ordinea contează (ca înainte): 1. stilurile de bază ale fiecărei pagini (erau în . ════════════════════════════════════════════════════════════════ */ /* ───────── paletă & fonturi ───────── */ :root{ --canvas:#F0E7D1; /* pergament */ --canvas-2:#E9DDC2; --paper:#FBF6E8; /* hârtie, pentru carduri */ --ink:#2A2118; --stone:#6B5D4A; --gilt:#8A6522; /* aur mat, doar accente mici */ --gilt-soft:#C9A35E; --panel:#1F2A22; --panel-ink:#EBE2CC; --line:#D5C8A8; --line-dark:#3A4136; --ff-body:"EB Garamond",Georgia,serif; --ff-mono:"EB Garamond",Georgia,serif; } ::selection{background:rgba(138,101,34,.25)} html{background:var(--canvas)} html,body{ overflow-x:clip; } body{ background:radial-gradient(ellipse at 50% 0%,#F8F1E0 0%,#F0E7D1 55%,#E7DBC0 100%); color:var(--ink); font-family:var(--ff-body); font-size:19px; line-height:1.6; } @media(max-width:620px){body{font-size:17.5px}} /* textură de hârtie, foarte discretă, peste toată pagina (sub lightbox) */ body::after{ content:"";position:fixed;inset:0;z-index:90;pointer-events:none; mix-blend-mode:multiply;opacity:.16; background-image:url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%27320%27 height=%27320%27%3E%3Cfilter id=%27g%27 x=%270%27 y=%270%27 width=%27100%25%27 height=%27100%25%27%3E%3CfeTurbulence type=%27fractalNoise%27 baseFrequency=%27.85%27 numOctaves=%272%27 stitchTiles=%27stitch%27/%3E%3CfeColorMatrix values=%270.45 0 0 0 0.25 0 0.38 0 0 0.18 0 0 0.25 0 0.08 0 0 0 0.9 0%27/%3E%3C/filter%3E%3Crect width=%27100%25%27 height=%27100%25%27 filter=%27url%28%23g%29%27/%3E%3C/svg%3E"); background-size:320px 320px; } /* ───────── etichete (eyebrow) ───────── */ .eyebrow{ font-family:var(--ff-body);font-size:18px;letter-spacing:.22em; text-transform:none;font-variant-caps:all-small-caps;gap:14px; } .eyebrow::before{width:34px} /* ───────── NAV ───────── */ .nav{background:color-mix(in srgb,var(--canvas) 94%,transparent); -webkit-backdrop-filter:none;backdrop-filter:none;border-bottom:1px solid var(--line)} .nav.scrolled{border-bottom-color:var(--line)} .brand{transition:opacity .2s} .brand:hover{opacity:.72} .nav__links a{font-family:var(--ff-body);font-variant-caps:all-small-caps;letter-spacing:.16em;font-size:18px;color:#4A3E2E} .nav__links a[aria-current="page"],.nav__links a[aria-current="true"]{color:var(--gilt)} /* ───────── butoane: dreptunghi cu chenar dublu ───────── */ .btn{ border:0;border-radius:0;padding:13px 26px;cursor:pointer; font-family:var(--ff-body);font-weight:500;font-variant-caps:all-small-caps; letter-spacing:.16em;font-size:18px;line-height:1.2; background:var(--ink);color:var(--paper)!important; box-shadow:inset 0 0 0 3px var(--ink),inset 0 0 0 4px rgba(240,231,209,.35); transition:transform .2s,background-color .2s,box-shadow .2s,color .2s; } .btn:hover{ transform:translateY(-2px);background:#7A5A1E;color:#F4ECD8!important;border-color:transparent; box-shadow:inset 0 0 0 3px #7A5A1E,inset 0 0 0 4px rgba(244,236,216,.4),0 12px 22px -12px rgba(122,90,30,.75); } .btn:active{transform:translateY(0)} .btn:disabled{opacity:.6;cursor:wait;transform:none} .btn--ghost{ background:transparent;color:var(--ink)!important; box-shadow:inset 0 0 0 1px var(--ink),inset 0 0 0 4px var(--canvas),inset 0 0 0 5px rgba(42,33,24,.55); } .btn--ghost:hover{ background:var(--ink);color:#F0E7D1!important; box-shadow:inset 0 0 0 4px var(--ink),inset 0 0 0 5px rgba(240,231,209,.4),0 12px 22px -12px rgba(25,22,18,.55); } .btn--gilt{background:var(--ink)} .btn--gilt:hover{background:#7A5A1E} .nav__links .btn{padding:11px 22px} /* selector de limbă */ .lang__btn{border-radius:2px;border-color:#CDBF9F;font-family:var(--ff-body);font-variant-caps:all-small-caps;letter-spacing:.14em;font-size:16px; transition:border-color .2s,color .2s,background-color .2s} .lang__btn:hover{border-color:var(--ink);color:var(--ink);background:rgba(42,33,24,.05)} .lang__menu{border-radius:2px;background:var(--paper);border-color:#CDBF9F;padding:4px} .lang__menu a{border-radius:0;font-size:18px} .lang__menu a:hover{background:rgba(138,101,34,.1);color:var(--ink)} .lang__menu a.active{font-weight:500} /* linkuri text: subliniere fină + schimbare de culoare */ .tlink{color:var(--gilt);border-bottom:1px solid currentColor;transition:color .2s} .tlink:hover{color:var(--ink)} .tlink--light{color:var(--gilt-soft)} .tlink--light:hover{color:#F4ECD8} .backlink{font-style:italic;font-size:18px;color:var(--stone);display:inline-block;margin-bottom:26px;border-bottom:1px solid transparent;transition:color .2s,border-color .2s} .backlink:hover{color:var(--ink);border-bottom-color:currentColor} /* ───────── HERO ───────── */ .hero h1{font-size:clamp(38px,5.2vw,64px);line-height:1.05;letter-spacing:-.012em;color:var(--ink)} .hero h1 em{color:var(--gilt)} .hero__lead{font-size:clamp(19px,1.7vw,21px);color:#5A4D3B} .hero__meta .l{font-family:var(--ff-body);font-size:15px;letter-spacing:.16em;text-transform:none;font-variant-caps:all-small-caps} .hero__panel{border-color:#D8CDB0} /* secțiuni */ .head p{color:#5A4D3B} /* ───────── GALERIE ───────── */ .filters{gap:10px} .filter{border-radius:0;font-size:17px;letter-spacing:.06em;font-family:var(--ff-body);border-color:#CDBF9F} .filter:hover{border-color:var(--ink);color:var(--ink);background:rgba(42,33,24,.05);transform:translateY(-1px)} .filter.active{background:var(--ink);color:var(--paper)} #galerie .filter:hover{border-color:var(--gilt-soft);color:#F4ECD8;background:rgba(201,163,94,.1)} #galerie .filter.active{background:var(--gilt-soft);border-color:var(--gilt-soft);color:#1F2A22} /* pozele au deja ramă: fără chenar, glow sau etichete de status pe carduri */ .work::before{display:none} .work__frame::after{display:none} .work__frame{aspect-ratio:auto;background:transparent;border:0;border-radius:3px} .work__img{height:auto;display:block} .work:hover .work__img,.work:focus-visible .work__img{transform:none;filter:none} .work__status{display:none!important} .work:hover .work__frame,.work:focus-visible .work__frame{transform:scale(1.04);box-shadow:0 26px 52px -22px rgba(25,22,18,.5)} #galerie .work__frame{background:transparent;box-shadow:0 16px 34px -20px rgba(237,231,218,.22)} #galerie .work:hover .work__frame,#galerie .work:focus-visible .work__frame{transform:scale(1.04);box-shadow:0 26px 52px -22px rgba(237,231,218,.42)} .work__title{font-size:21px;transition:color .25s} #galerie .work:hover .work__title{color:#F4ECD8} .work__cat{font-family:var(--ff-body);font-size:17px;letter-spacing:.16em;font-variant-caps:all-small-caps} .work__dim{font-family:var(--ff-body);font-size:16px;color:var(--stone)} #galerie .work__dim{color:#B9AF98} #galerie .work__cat{color:var(--gilt-soft)} .work__meta{padding:16px 2px 0} /* trei lucrări pe pagina principală (fără carusel) */ .gallery--trio{display:flex;flex-wrap:wrap;justify-content:center;align-items:flex-start;gap:52px 40px} .gallery--trio .work{flex:1 1 280px;max-width:340px} .gallery-hint{margin-top:44px;text-align:center;font-style:italic;font-size:17px;color:#B9AF98} .gallery-note{font-family:var(--ff-body);font-size:17px;letter-spacing:.04em;border-top-color:var(--line)} /* ───────── DESPRE ───────── */ #despre{background:none!important} .about__portrait{ aspect-ratio:1;border-radius:50%;max-width:380px;width:100%;margin-inline:auto; border:1px solid #D8CDB0; box-shadow:0 30px 60px -26px rgba(25,22,18,.55),0 8px 22px -10px rgba(25,22,18,.3); } .about__body p{color:#3A2F22} .about__body p.lead{color:var(--ink)} .about__body p.lead + p::first-letter{ float:left;font-family:var(--ff-display);font-size:92px;line-height:.78; padding:10px 14px 0 0;color:var(--gilt); } .craft span{border-radius:0;border-color:#CDBF9F;font-size:16px;color:var(--stone); transition:border-color .2s,color .2s,background-color .2s} .craft span:hover{border-color:var(--gilt);color:var(--gilt);background:rgba(138,101,34,.06)} /* ───────── COMENZI (panou închis) ───────── */ .commissions .head p{color:#B7B1A3} .step{transition:none} .step__n{font-family:var(--ff-display);font-style:italic;font-size:38px;line-height:1;letter-spacing:0;color:var(--gilt-soft);transition:color .25s} .step:hover .step__n{color:#E6CB8E} .step p{font-size:16.5px;color:#AAA496} .commission-note{border-left-color:var(--gilt-soft)} .commission-note h4{font-family:var(--ff-body);font-size:18px;font-weight:500;letter-spacing:.16em;text-transform:none;font-variant-caps:all-small-caps;color:var(--gilt-soft)} .commission-note p{font-size:18px;color:#CFC9BD} .pricing{border-radius:0} .price{transition:background-color .25s} .price:hover{background:rgba(237,231,218,.05)} .price h4{font-size:22px} .price .amt{font-family:var(--ff-display);font-style:italic;font-size:19px;color:var(--gilt-soft)} .price p{font-size:16px;color:#AAA496} .pricing-note{font-family:var(--ff-body);font-style:italic;font-size:15.5px;letter-spacing:0;color:#8F897C} /* ───────── CONTACT & FORMULAR: card de hârtie, chenar dublu bej ───────── */ #contact .contact-glass,#orderForm{ background:var(--paper);border:1px solid #CDBF9F;border-radius:4px; box-shadow:inset 0 0 0 5px var(--paper),inset 0 0 0 6px #D5C8A8,0 34px 64px -40px rgba(25,22,18,.38),0 2px 8px -4px rgba(25,22,18,.08); } #contact .contact-glass::before,#orderForm::before{display:none} .contact__info p{color:#5A4D3B} .infoline .k{font-family:var(--ff-body);font-size:16px;letter-spacing:.16em;text-transform:none;font-variant-caps:all-small-caps;color:var(--stone)} .infoline .v{font-size:19px} .infoline a.v{border-bottom:1px solid transparent;transition:color .2s,border-color .2s} .infoline a.v:hover{color:var(--gilt);border-bottom-color:currentColor} .field label{font-family:var(--ff-body);font-size:16px;letter-spacing:.16em;text-transform:none;font-variant-caps:all-small-caps;color:var(--stone)} #contactForm .field input,#contactForm .field textarea,#contactForm .field select, #orderForm .field input,#orderForm .field textarea,#orderForm .field select{ border-bottom-color:#B8A982;color:var(--ink); font-family:var(--ff-display);font-style:italic;font-size:19px; } #contactForm .field input:hover,#contactForm .field textarea:hover,#contactForm .field select:hover, #orderForm .field input:hover,#orderForm .field textarea:hover,#orderForm .field select:hover{border-bottom-color:var(--ink)} #contactForm .field input::placeholder,#contactForm .field textarea::placeholder, #orderForm .field input::placeholder,#orderForm .field textarea::placeholder{font-size:19px;color:rgba(107,93,74,.55)} #contactForm .field select option,#orderForm .field select option{background:var(--paper);color:var(--ink);font-style:normal} #contactForm .field input:-webkit-autofill,#orderForm .field input:-webkit-autofill{-webkit-box-shadow:0 0 0 100px var(--paper) inset;-webkit-text-fill-color:#2A2118} .form-note,.field-hint{font-family:var(--ff-body);font-style:italic;font-size:16px;color:var(--stone)} .form-actions{display:flex;flex-wrap:wrap;align-items:center;gap:20px;margin-top:6px} .form-actions .btn{margin-top:0!important} #orderForm .group-title{font-family:var(--ff-body);font-size:18px;letter-spacing:.16em;text-transform:none;font-variant-caps:all-small-caps;color:var(--gilt);border-bottom-color:var(--line)} #orderForm .group-title::before{content:counter(grp,upper-roman) ".";font-family:var(--ff-display);font-style:italic;font-variant-caps:normal;font-size:22px;letter-spacing:0;color:var(--stone)} .drop{border-radius:0;border-color:#B8A982;background:transparent} .drop:hover{border-color:var(--gilt);background:rgba(138,101,34,.06)} .order-ok{border-radius:4px} .order-ok p{font-size:17px} /* ───────── NEWSLETTER ───────── */ .newsletter{background:var(--canvas-2)} .newsletter__intro{color:#5A4D3B} /* ───────── FOOTER: butoane cu chenar ───────── */ .foot{gap:24px} .foot__links{gap:12px} .foot__links a,.foot__social a{ border:1px solid rgba(232,226,214,.25);border-radius:2px; transition:transform .2s,border-color .2s,background-color .2s,color .2s; } .foot__links a{display:inline-block;padding:10px 20px;font-family:var(--ff-body);font-variant-caps:all-small-caps;letter-spacing:.14em;font-size:17px;color:#B9B3A4} .foot__links a:hover,.foot__social a:hover{transform:translateY(-2px);border-color:var(--gilt-soft);background:rgba(201,163,94,.1)} .foot__links a:hover{color:#F4ECD8} .foot__social a{padding:8px 16px} .foot__social b{font-size:15.5px} .foot small{font-size:15px;color:#8F897C} .foot__social small{font-size:13px;color:#B9B3A4} /* ───────── LIGHTBOX (aceleași detalii, alt aspect) ───────── */ .lb{background:rgba(18,22,18,.94)} .lb__frame{border:0;border-radius:3px;box-shadow:0 30px 70px -20px rgba(0,0,0,.8)} .lb__cap{font-size:28px;line-height:1.2} .lb__cap small{font-family:var(--ff-body);font-style:italic;font-size:18px;letter-spacing:0;color:#B9AF98} .lb__close{width:44px;height:44px;padding:0;display:grid;place-items:center;font-size:24px; border:1px solid rgba(232,226,214,.3);border-radius:50%; transition:background-color .2s,border-color .2s,transform .2s} .lb__close:hover{background:rgba(201,163,94,.16);border-color:var(--gilt-soft);transform:scale(1.08)} .lb__nav{background:transparent;border:1px solid rgba(232,226,214,.3); -webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none} .lb__nav:hover{background:rgba(201,163,94,.16);border-color:var(--gilt-soft)} .lb__badge{display:inline-flex;align-items:center;gap:8px;padding:5px 14px;border-radius:2px; font-family:var(--ff-body);font-size:16px;letter-spacing:.16em;text-transform:none;font-variant-caps:all-small-caps} .lb__badge::before{content:"";width:8px;height:8px;border-radius:50%;background:currentColor} .lb__badge--available,.lb__badge--sold{background:transparent;border:1px solid currentColor} .lb__badge--available{color:#8FBF8A} .lb__badge--sold{color:#B9B3A6} .lb__pricebox .lb__price{border:1px solid rgba(232,226,214,.25);border-radius:2px;background:transparent; padding:10px 24px;font-size:28px;color:#E6CB8E} .lb__pricebox .lb__price small{font-family:var(--ff-body);font-size:15px;letter-spacing:.16em;text-transform:none;font-variant-caps:all-small-caps;color:#B9AF98;transform:none} .lb__action button.btn{ border:0;border-radius:0;padding:14px 30px;background:#A9772F;color:#FBF6E8!important; font-family:var(--ff-body);font-variant-caps:all-small-caps;letter-spacing:.16em;font-size:19px; box-shadow:inset 0 0 0 3px #A9772F,inset 0 0 0 4px rgba(251,246,232,.4); } .lb__action button.btn:hover{ transform:translateY(-2px);background:#7A5A1E; box-shadow:inset 0 0 0 3px #7A5A1E,inset 0 0 0 4px rgba(244,236,216,.4),0 12px 22px -12px rgba(122,90,30,.75); } .lb__action .lb__sold{font-family:var(--ff-body);font-size:19px;letter-spacing:.16em;text-transform:none;font-variant-caps:all-small-caps;color:#B9AF98} .lb__action a.lb__similar{color:var(--gilt-soft);font-style:italic;font-size:21px;text-decoration:none; border-bottom:1px solid currentColor;opacity:1;transition:color .2s} .lb__action a.lb__similar:hover{color:#F4ECD8} /* ═════════ ajustări (rundă 2) ═════════ */ /* lucrări selectate: toate pozele, aceeași dimensiune */ .gallery--trio .work__frame{aspect-ratio:4/5;background:var(--panel)} .gallery--trio .work__img{width:100%;height:100%;object-fit:cover;object-position:center} /* text centrat în toate butoanele (compensăm spațierea dintre litere, care adaugă un gol în dreapta ultimei litere) */ .btn,.lb__action button.btn,.filter,.lang__btn,.lb__close{ display:inline-flex;align-items:center;justify-content:center;text-align:center; } .btn{text-indent:.16em} .lb__action button.btn{text-indent:.16em} .filter{text-indent:.06em} .lb__close{text-indent:0} /* mesaj de stare sub formular: apare doar când există text (succes / eroare) */ .form-note:empty{display:none} /* footer: linkuri fără chenar, mai groase și mai mari */ .foot__links{gap:10px 26px} .foot__links a{ border:0;border-radius:0;padding:6px 2px; font-size:18px;font-weight:500;letter-spacing:.12em;color:#EBE2CC; position:relative; } .foot__links a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1.5px;background:var(--gilt-soft); transform:scaleX(0);transform-origin:left center;transition:transform .28s ease} .foot__links a:hover{transform:none;background:transparent;color:var(--gilt-soft)} .foot__links a:hover::after{transform:scaleX(1)} /* rețele sociale: chenarul în culoarea iconițelor */ .foot__social a{border-color:var(--gilt-soft)} .foot__social a:hover{border-color:#E6CB8E;background:rgba(201,163,94,.14)} /* spațiu mai mic între „Despre" și „Contact" */ #despre.section-pad{padding-bottom:clamp(28px,4vw,52px)} #contact.section-pad{padding-top:clamp(20px,3vw,40px)} /* comenzi: pași și notă mai compacte */ .steps{margin-bottom:clamp(6px,1vw,12px);gap:26px} .commission-note{margin:clamp(18px,2.2vw,26px) 0 clamp(22px,2.8vw,32px)} .commission-note p{line-height:1.6} /* formulare: câmpurile de completat au chenar (titlurile de grup rămân cu linie) */ #contactForm .field input,#contactForm .field textarea,#contactForm .field select, #orderForm .field input,#orderForm .field textarea,#orderForm .field select{ border:1px solid #B8A982;border-radius:2px;background-color:#FFFDF6; padding:11px 14px;box-shadow:none; } #contactForm .field textarea,#orderForm .field textarea{padding-top:11px;line-height:1.55} #contactForm .field select,#orderForm .field select{padding-right:40px;background-position:right 14px center} #contactForm .field label,#orderForm .field label{margin-bottom:8px} #contactForm .field input:hover,#contactForm .field textarea:hover,#contactForm .field select:hover, #orderForm .field input:hover,#orderForm .field textarea:hover,#orderForm .field select:hover{ border-color:var(--ink);background-color:#FFFFFF} #contactForm .field input:focus,#contactForm .field textarea:focus,#contactForm .field select:focus, #orderForm .field input:focus,#orderForm .field textarea:focus,#orderForm .field select:focus{ border-color:var(--gilt);background-color:#FFFFFF;box-shadow:0 0 0 3px rgba(138,101,34,.14)} #contactForm .field:focus-within label,#orderForm .field:focus-within label{color:var(--gilt)} /* ═════════ rundă 3: celelalte pagini ═════════ */ /* galerie completă: toate lucrările la aceeași dimensiune */ .gallery:not(.gallery--trio) .work__frame{aspect-ratio:4/5;background:var(--canvas-2)} .gallery .work__img{width:100%;height:100%;object-fit:cover} .gallery:not(.gallery--trio){gap:clamp(28px,3.4vw,44px) clamp(16px,2vw,28px)} .work:hover .work__title{color:var(--gilt)} .pagination{gap:10px} .page-btn{ min-width:42px;height:42px;padding:0 8px;border-radius:0; display:inline-flex;align-items:center;justify-content:center; font-family:var(--ff-body);font-size:18px;color:var(--stone);border-color:#CDBF9F; transition:transform .2s,border-color .2s,color .2s,background-color .2s; } .page-btn:hover{border-color:var(--ink);color:var(--ink);background:rgba(42,33,24,.05);transform:translateY(-1px)} .page-btn.active{background:var(--ink);border-color:var(--ink);color:var(--paper)} /* întrebări frecvente */ .page-head h1{font-weight:400} .faq-group__title{font-family:var(--ff-body);font-size:18px;letter-spacing:.16em;text-transform:none;font-variant-caps:all-small-caps;border-bottom-color:var(--line);gap:14px} .faq-group__title::before{width:30px} details.faq{border-bottom-color:var(--line)} details.faq summary{font-size:clamp(19px,2.1vw,22px);transition:color .2s,padding-left .25s} details.faq summary:hover{padding-left:6px} .faq__answer{font-size:19px;line-height:1.65;color:#4A3E2E} .faq__answer strong{color:var(--ink)} .faq-cta{ background:var(--paper);border:1px solid #CDBF9F;border-radius:4px; box-shadow:inset 0 0 0 5px var(--paper),inset 0 0 0 6px #D5C8A8,0 34px 64px -40px rgba(25,22,18,.38),0 2px 8px -4px rgba(25,22,18,.08); } .faq-cta__sub{color:#5A4D3B} /* ───── pagina de confidențialitate ───── */ .legal{font-size:19px;line-height:1.7} .legal .topbar{border-bottom:1px solid var(--line)} .legal .topbar .brand{transition:opacity .2s} .legal .topbar .brand:hover{opacity:.72} .legal .topbar__right{font-size:18px;font-style:italic} .legal .topbar__right a{color:var(--stone);border-bottom:1px solid transparent;transition:color .2s,border-color .2s} .legal .topbar__right a:hover{color:var(--ink);border-bottom-color:currentColor;text-decoration:none} .legal .lang{font-family:var(--ff-body);font-style:normal;font-variant-caps:all-small-caps;letter-spacing:.14em;font-size:17px} .legal .eyebrow{display:flex;gap:14px;align-items:center;margin-bottom:14px} .legal .eyebrow::before{content:"";display:inline-block;height:1px;background:var(--gilt)} .legal h1,.legal h2{font-weight:400} .legal h2{font-size:clamp(22px,3vw,27px)} .legal .updated{font-family:var(--ff-body);font-style:italic;font-size:17px} .legal .lede{font-size:20.5px;color:#3A2F22} .legal main a{color:var(--gilt);border-bottom:1px solid currentColor;transition:color .2s} .legal main a:hover{color:var(--ink);text-decoration:none} .legal strong{font-weight:500;color:var(--ink)} .legal .box{background:var(--paper);border:1px solid #CDBF9F;border-radius:4px; box-shadow:inset 0 0 0 4px var(--paper),inset 0 0 0 5px #D5C8A8} .legal .fill{border-radius:2px;font-family:var(--ff-body)} .legal hr{border-top-color:var(--line)} /* ───── pagina de verificare a autenticității ───── */ body.verify{ --cream:#F0E7D1;--ink:#2A2118;--stone:#6B5D4A;--gilt-deep:#7A5A1E; --panel:#EFE5CB;--hair:#D5C8A8; --sans:"EB Garamond",Georgia,serif;--mono:"EB Garamond",Georgia,serif; font-size:19px; } .verify header{border-bottom:1px solid var(--hair)} .verify .mark{font-family:var(--ff-display);font-weight:400;font-style:italic;font-size:27px;transition:opacity .2s} .verify .mark:hover{opacity:.72} .verify .mark small{font-family:var(--ff-body);font-style:normal;font-variant-caps:all-small-caps;text-transform:none;letter-spacing:.22em;font-size:15px;color:var(--stone)} .verify .lang{border-radius:2px;border-color:#CDBF9F} .verify .lang button{font-size:16px;letter-spacing:.14em;transition:background-color .2s,color .2s} .verify .lang button:hover{background:rgba(42,33,24,.06);color:var(--ink)} .verify .lang button[aria-pressed="true"]{background:var(--ink);color:var(--paper)} .verify .eyebrow{font-size:18px;letter-spacing:.22em;text-transform:none;font-variant-caps:all-small-caps;color:var(--gilt)} .verify h1,.verify .panel h2,.verify .res h3{font-weight:400} .verify .lede{color:#3A2F22} .verify .panel{background:var(--paper);border:1px solid #CDBF9F;border-radius:4px; box-shadow:inset 0 0 0 5px var(--paper),inset 0 0 0 6px #D5C8A8,0 34px 64px -40px rgba(25,22,18,.38)} .verify .panel p.hint{font-style:italic;font-size:16px;letter-spacing:0} .verify input[type=text]{ font-size:19px;letter-spacing:.12em;background:#FFFDF6;border:1px solid #B8A982;border-radius:2px; transition:border-color .2s,background-color .2s,box-shadow .2s; } .verify input[type=text]:hover{border-color:var(--ink);background:#fff} .verify input[type=text]:focus{border-color:var(--gilt);background:#fff;box-shadow:0 0 0 3px rgba(138,101,34,.14)} .verify button.go{ display:inline-flex;align-items:center;justify-content:center;text-indent:.16em; border-radius:0;font-size:18px;font-variant-caps:all-small-caps;text-transform:none;letter-spacing:.16em; background:var(--ink);color:var(--paper); box-shadow:inset 0 0 0 3px var(--ink),inset 0 0 0 4px rgba(240,231,209,.35); transition:transform .2s,background-color .2s,box-shadow .2s; } .verify button.go:hover{ opacity:1;transform:translateY(-2px);background:#7A5A1E; box-shadow:inset 0 0 0 3px #7A5A1E,inset 0 0 0 4px rgba(244,236,216,.4),0 12px 22px -12px rgba(122,90,30,.75); } .verify .res{border-radius:2px} .verify .res.ok{background:var(--paper);border-color:#CDBF9F} .verify .res .tag{font-size:16px;letter-spacing:.16em;text-transform:none;font-variant-caps:all-small-caps} .verify .meta td:first-child{font-size:16px;letter-spacing:.12em;text-transform:none;font-variant-caps:all-small-caps} .verify .note h4{font-size:18px;letter-spacing:.16em;text-transform:none;font-variant-caps:all-small-caps} .verify .note p{color:#4A3E2E} .verify footer{font-size:17px;letter-spacing:0;font-style:italic} .verify footer a{color:var(--stone);border-bottom:1px solid transparent;transition:color .2s,border-color .2s} .verify footer a:hover{color:var(--gilt);border-bottom-color:currentColor} /* ───── pagina 404 ───── */ .e404 main{max-width:560px} .e404__logo{transition:opacity .2s} .e404__label{font-size:18px;letter-spacing:.22em;text-transform:none;font-variant-caps:all-small-caps} .e404__num{font-weight:400} .e404__rule{width:70px;background:#B8A982} .e404__title{font-weight:400} .e404__text{font-size:20px;color:#5A4D3B} .e404__text.en{font-size:17px;font-style:italic;opacity:1} .e404__btn{ display:inline-flex;align-items:center;justify-content:center;text-align:center;text-indent:.16em; border-radius:0;padding:13px 28px;font-size:18px;font-weight:500;font-variant-caps:all-small-caps;letter-spacing:.16em; background:var(--ink);color:var(--paper); box-shadow:inset 0 0 0 3px var(--ink),inset 0 0 0 4px rgba(240,231,209,.35); transition:transform .2s,background-color .2s,box-shadow .2s; } .e404__btn:hover{ transform:translateY(-2px);background:#7A5A1E; box-shadow:inset 0 0 0 3px #7A5A1E,inset 0 0 0 4px rgba(244,236,216,.4),0 12px 22px -12px rgba(122,90,30,.75); } /* galerie pe telefon: fără depășire laterală */ .gallery .work{min-width:0} @media(max-width:900px){.gallery:not(.gallery--trio){grid-template-columns:repeat(2,minmax(0,1fr))}} @media(max-width:620px){ .gallery:not(.gallery--trio){grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 14px} .gallery .work__meta{flex-direction:column;align-items:flex-start;gap:2px} .gallery .work__title{font-size:18px} .gallery .work__dim{font-size:15px} } .verify .lang button{font-family:var(--ff-body)} .verify .note h4{font-weight:500} /* ui-fixes.css — butoane centrate, verde unitar, hover nou pentru linkuri și meniu (se încarcă după vintage.css) */ :root{ --btn-green:#1F2A22; --btn-hover:#7A5A1E; } /* ───────── BUTOANE: text centrat vertical + orizontal ───────── EB Garamond cu litere mici-majuscule stă jos în caseta liniei, de aceea textul părea coborât. Compensăm: padding asimetric (fallback), iar în browserele noi tăiem spațiul fontului cu text-box. */ .btn,.e404__btn,.verify button.go,.lb__action button.btn, .filter,.page-btn,.lang__btn,.verify .lang button,form button[type="submit"]{ display:inline-flex; align-items:center; justify-content:center; text-align:center; line-height:1; } .btn,.e404__btn,.verify button.go{ padding:11px 26px 15px; } .nav__links .btn{ padding:9px 22px 13px; } .lb__action button.btn{ padding:12px 30px 16px; } .filter{ padding:10px 17px 12px; } .page-btn{ padding:0 8px 3px; } .lang__btn{ padding:6px 12px 8px; } @supports (text-box: trim-both ex alphabetic){ .btn,.e404__btn,.verify button.go,.lb__action button.btn,.nav .nav__links a:not(.btn){ text-box:trim-both ex alphabetic; } .btn,.e404__btn,.verify button.go{ padding:18px 26px; } .nav__links .btn{ padding:16px 22px; } .lb__action button.btn{ padding:19px 30px; } } /* ───────── CULOARE: același verde ca panoul/footerul, în loc de negru ───────── */ .btn,.btn--gilt,.e404__btn,.verify button.go{ background:var(--btn-green); border-color:var(--btn-green); box-shadow:inset 0 0 0 3px var(--btn-green),inset 0 0 0 4px rgba(240,231,209,.35); } .btn:hover,.btn--gilt:hover,.e404__btn:hover,.verify button.go:hover{ background:var(--btn-hover); border-color:var(--btn-hover); box-shadow:inset 0 0 0 3px var(--btn-hover),inset 0 0 0 4px rgba(244,236,216,.4),0 12px 22px -12px rgba(122,90,30,.75); } .btn--ghost{ background:transparent; border-color:transparent; box-shadow:inset 0 0 0 1px var(--btn-green),inset 0 0 0 4px var(--canvas),inset 0 0 0 5px rgba(31,42,34,.55); } .btn--ghost:hover{ background:var(--btn-green); border-color:var(--btn-green); box-shadow:inset 0 0 0 4px var(--btn-green),inset 0 0 0 5px rgba(240,231,209,.4),0 12px 22px -12px rgba(31,42,34,.55); } .filter.active,.page-btn.active{ background:var(--btn-green); border-color:var(--btn-green); color:var(--paper,#FBF6E8); } .verify .lang button[aria-pressed="true"]{ background:var(--btn-green); color:var(--paper,#FBF6E8); } /* ───────── MENIU: fără linia stânga→dreapta, indicator care alunecă între linkuri ───────── */ .nav__links a:not(.btn)::after, .nav__links a:not(.btn):hover::after, .nav__links a[aria-current]::after{ display:none !important; transform:none !important; } .nav .nav__links{ position:relative; gap:4px; } .nav .nav__links a:not(.btn){ position:relative; z-index:1; display:inline-flex; align-items:center; line-height:1; padding:8px 15px 12px; border-radius:0; transition:color .25s ease; } @media(min-width:901px){ .nav .nav__links a:not(.btn).under{ color:#7A5A1E; } } .nav .nav__links .btn{ margin-left:14px; background:#A9772F; border-color:#A9772F; box-shadow:inset 0 0 0 3px #A9772F,inset 0 0 0 4px rgba(251,246,232,.4); } .nav .nav__links .btn:hover{ background:#7A5A1E; border-color:#7A5A1E; box-shadow:inset 0 0 0 3px #7A5A1E,inset 0 0 0 4px rgba(244,236,216,.4),0 12px 22px -12px rgba(122,90,30,.75); } .nav__pill{ position:absolute; z-index:0; left:0; top:0; width:0; height:0; border-radius:0; background:rgba(138,101,34,.16); box-shadow:inset 0 -2px 0 var(--gilt); opacity:0; pointer-events:none; transition:left .38s cubic-bezier(.3,.7,.2,1), width .38s cubic-bezier(.3,.7,.2,1), top .38s cubic-bezier(.3,.7,.2,1), height .38s cubic-bezier(.3,.7,.2,1), opacity .25s ease; } .nav__pill.on{ opacity:1; } .nav__pill.no-anim{ transition:none; } @media(max-width:900px){ .nav__pill{ display:none; } .nav .nav__links a:not(.btn){ padding:4px 0; border-radius:0; display:block; } .nav .nav__links a:not(.btn):hover{ color:var(--gilt); } .nav .nav__links .btn{ margin-left:0; } } /* ───────── LINKURI din pagină: highlight discret în loc de linie ───────── */ .tlink, .backlink, .infoline a.v{ text-decoration:none !important; background-image:none !important; border-radius:0; padding:1px 5px; margin:0 -5px; transition:background-color .25s ease, color .25s ease; } .tlink::after, .backlink::after{ display:none !important; } .tlink:hover, .backlink:hover, .infoline a.v:hover{ color:var(--gilt-deep,#7A5A1E); background-color:rgba(138,101,34,.13); } .tlink--light:hover{ color:var(--gilt-soft,#C9A35E); background-color:rgba(201,163,94,.16); } .foot__links a, .lang__menu a{ border-radius:0; transition:background-color .25s ease, color .25s ease; } .foot__links a::after,.foot__links a:hover::after{ display:none !important; } .foot__links a{ padding:6px 12px; margin:0 -12px; border-radius:0; } .foot__links a:hover{ background-color:rgba(201,163,94,.22); transform:none; } /* politica de confidențialitate / verificare */ .legal a:not(.brand), .verify main a{ text-decoration:none; border-radius:0; transition:background-color .25s ease; } .legal main a:hover, .verify main a:hover{ text-decoration:none; background-color:rgba(138,101,34,.13); } .topbar__right a:hover{ background-color:rgba(138,101,34,.13); border-radius:0; } .topbar__right a{ padding:6px 12px; transition:background-color .25s ease,color .25s ease; } @media(min-width:901px){ @supports (text-box: trim-both ex alphabetic){ .nav .nav__links a:not(.btn){ padding-block:14px; } } } .legal .topbar__right a:hover,.verify footer a:hover,.backlink:hover,.infoline a.v:hover{ border-bottom-color:transparent; } /* ───────── bulină de disponibilitate: verde = disponibilă, neagră/gri = indisponibilă ───────── */ .work__frame{ position:relative; } .work[data-status] .work__frame::before{ content:""; position:absolute; top:12px; right:12px; z-index:2; width:15px; height:15px; border-radius:50%; background:#3A3A3A; box-shadow:0 0 0 2px rgba(251,246,232,.9),0 2px 6px rgba(0,0,0,.35); pointer-events:none; } .work[data-status="available"] .work__frame::before{ background:#2E9E4F; } /* controalele de formular moștenesc fontul paginii (fără fonturi implicite de browser) */ button,input,select,textarea,option{ font-family:inherit; } /* ───────── MENIU PE TELEFON: dropdown care alunecă de sub bară (aceleași dimensiuni) ───────── */ @media(max-width:900px){ .nav .nav__links{ display:flex !important; flex-direction:column; align-items:stretch; gap:0; position:absolute; top:100%; left:0; right:0; bottom:auto; width:auto; height:auto; max-height:calc(100vh - 73px); max-height:calc(100dvh - 73px); -webkit-overflow-scrolling:touch; margin:0; padding:10px var(--pad) 34px; overflow-y:auto; overscroll-behavior:contain; background:var(--canvas); border-left:0; border-bottom:1px solid var(--line); box-shadow:0 30px 40px -28px rgba(25,22,18,.35); clip-path:inset(0 0 100% 0); transform:translateY(-14px); opacity:0; visibility:hidden; z-index:60; transition:clip-path .5s cubic-bezier(.3,.7,.2,1),transform .5s cubic-bezier(.3,.7,.2,1), opacity .3s ease,visibility 0s linear .5s; } .nav .nav__links.open{ clip-path:none; transform:none; opacity:1; visibility:visible; transition:clip-path .5s cubic-bezier(.3,.7,.2,1),transform .5s cubic-bezier(.3,.7,.2,1), opacity .3s ease,visibility 0s; } .nav .nav__links a:not(.btn){ display:block; text-box:none; padding:20px 4px; border-radius:0; font-size:25px; line-height:1.2; letter-spacing:.12em; border-bottom:1px solid var(--line); color:#2A2118; } .nav .nav__links a:not(.btn):first-of-type{ border-top:1px solid var(--line); } .nav .nav__links a:not(.btn)[aria-current]{ color:var(--gilt); } .nav .nav__links a:not(.btn):hover,.nav .nav__links a:not(.btn):active{ color:var(--gilt-deep,#7A5A1E); background:rgba(138,101,34,.1); } .nav .nav__links .btn{ margin:34px 0 0; width:100%; font-size:20px; padding:20px 22px 23px; } html.menu-open{ overflow:hidden; } html.menu-open body{ overflow-x:clip; } .menu-scrim{ position:fixed; inset:0; z-index:40; background:rgba(25,22,18,.28); opacity:0; visibility:hidden; transition:opacity .5s ease,visibility 0s linear .5s; } body.menu-open .menu-scrim{ opacity:1; visibility:visible; transition:opacity .5s ease,visibility 0s; } } @media(min-width:901px){ .menu-scrim{ display:none; } } /* verificare: pe telefon câmpul și butonul nu se întind (flex-basis fusese aplicat pe înălțime) */ @media(max-width:560px){ .verify .field input[type=text],.verify .field button.go{ flex:0 0 auto; } } @media(max-width:900px){ .nav{ position:sticky; top:0; z-index:50; -webkit-backdrop-filter:none; backdrop-filter:none; } } /* ───────── BARA DE SUS: întunecată, logo la mijloc, meniu stânga, buton + limbă dreapta ───────── */ .nav{ --bar:#1F2A22; --bar-gold:#C9A35E; --bar-gold-hi:#E6CB8E; background:var(--bar); border-bottom:1px solid rgba(201,163,94,.28); -webkit-backdrop-filter:none; backdrop-filter:none; } .nav.scrolled{ border-bottom-color:rgba(201,163,94,.28); } .nav .nav__inner{ display:grid; grid-template-columns:1fr auto 1fr; align-items:center; column-gap:24px; height:80px; } .nav .nav__toggle{ grid-column:1; justify-self:start; color:var(--bar-gold); margin-left:-8px; } .nav .nav__links{ grid-column:1; grid-row:1; justify-self:start; display:flex; align-items:center; gap:28px; white-space:nowrap; } .nav .brand{ grid-column:2; grid-row:1; justify-self:center; } .nav .brand img{ height:44px; width:auto; } .nav .nav__right{ grid-column:3; grid-row:1; justify-self:end; display:flex; align-items:center; gap:18px; } .nav .nav__cta-m{ display:none; } .nav .btn{ white-space:nowrap; } @media(min-width:901px){ .nav .nav__links a[href="/"]:not(.btn),.nav .nav__links a[href="/index-en"]:not(.btn){ display:none; } } .nav .nav__links a:not(.btn){ color:var(--bar-gold); } .nav .nav__links a:not(.btn)::after{ background:var(--bar-gold); } .nav .nav__links a:not(.btn):hover{ color:var(--bar-gold-hi); } .nav .nav__links a[aria-current="page"],.nav .nav__links a[aria-current="true"]{ color:var(--bar-gold-hi); } .nav .btn{ background:transparent; border:1px solid var(--bar-gold); color:#F4ECD8!important; box-shadow:none; transform:none; padding:10px 20px 12px; } .nav .btn:hover{ background:var(--bar-gold); border-color:var(--bar-gold); color:#1F2A22!important; box-shadow:none; transform:none; } .nav .lang__btn{ background:transparent; border-color:rgba(201,163,94,.55); color:var(--bar-gold); } .nav .lang__btn:hover{ border-color:var(--bar-gold); color:var(--bar-gold-hi); background:rgba(201,163,94,.1); } .nav .lang__menu{ background:var(--bar); border-color:rgba(201,163,94,.4); box-shadow:0 18px 30px -14px rgba(0,0,0,.5); } .nav .lang__menu a{ color:var(--bar-gold); } .nav .lang__menu a:hover{ background:rgba(201,163,94,.12); color:var(--bar-gold-hi); } .nav .lang__menu a.active{ color:var(--bar-gold-hi); } @media(min-width:901px){ .nav .nav__toggle{ display:none; } } @media(max-width:900px){ .nav .nav__inner{ height:72px; } .nav .nav__toggle{ display:flex; align-items:center; justify-content:center; } .nav .nav__cta{ display:none; } .nav .brand img{ height:38px; } .nav .nav__links{ display:flex!important; align-items:stretch; gap:0; justify-self:stretch; background:var(--bar); border-bottom:1px solid rgba(201,163,94,.28); box-shadow:0 30px 40px -28px rgba(0,0,0,.6); top:100%; } .nav .nav__links a:not(.btn){ color:var(--bar-gold); border-bottom-color:rgba(201,163,94,.22); } .nav .nav__links a:not(.btn):first-of-type{ border-top-color:rgba(201,163,94,.22); } .nav .nav__links a:not(.btn)[aria-current]{ color:var(--bar-gold-hi); } .nav .nav__links a:not(.btn):hover,.nav .nav__links a:not(.btn):active{ color:var(--bar-gold-hi); background:rgba(201,163,94,.1); } .nav .nav__links .nav__cta-m{ display:block; text-align:center; background:transparent; border:1px solid var(--bar-gold); color:#F4ECD8!important; margin:30px 0 0; } .nav .nav__links .nav__cta-m:hover{ background:var(--bar-gold); color:#1F2A22!important; } } /* ════════════════════════════════════════════════════════════════ COMUN: theme-dark.css ════════════════════════════════════════════════════════════════ */ /* ═══ theme-dark.css — paleta închisă (gri-măsliniu + auriu), încărcată după vintage.css ═══ */ :root{ --canvas:#494C45; --canvas-2:#42453E; --paper:#53574E; --ink:#EDE9DF; --stone:#CFCBBE; --gilt:#D9B873; --gilt-soft:#D9B873; --gilt-deep:#E6CB8E; --panel:#363933; --panel-ink:#EDE9DF; --line:#6B6E65; --line-dark:#6B6E65; --maxw:1180px; --pad:clamp(20px,5vw,64px); } ::selection{background:rgba(217,184,115,.35);color:#fff} html{background:#3d403a} body{ background:radial-gradient(ellipse at 70% 0%,#575a51 0%,#494C45 55%,#3d403a 100%); color:var(--ink); } body::after{ opacity:.07; mix-blend-mode:soft-light; } /* bara: pe toată lățimea, aceeași culoare cu fundalul, logo auriu */ .nav{ --bar:#42453E; --bar-gold:#D9B873; --bar-gold-hi:#EFD9A0; background:var(--bar); border-bottom-color:rgba(217,184,115,.3); } .nav.scrolled{ border-bottom-color:rgba(217,184,115,.3); } .nav .nav__inner{ padding-left:var(--pad)!important; padding-right:var(--pad)!important; } .nav .nav__links{ gap:clamp(14px,1.7vw,28px); } .nav .nav__right{ gap:clamp(14px,1.6vw,24px); } .nav .btn{ border-color:var(--bar-gold); color:var(--bar-gold)!important; } .nav .btn:hover{ background:var(--bar-gold); color:#2c2f2a!important; } .nav .nav__cta-m{ color:var(--bar-gold)!important; } .nav .lang__btn{ border-color:rgba(217,184,115,.55); } .nav .lang__menu{ background:var(--bar); border-color:rgba(217,184,115,.4); } @media(max-width:900px){ .nav .nav__links{ background:var(--bar); border-bottom-color:rgba(217,184,115,.3); } .nav .nav__links .nav__cta-m:hover{ background:var(--bar-gold); color:#2c2f2a!important; } } /* ───── texte ───── */ .hero__lead,.head p,.about__body p,.contact__info p,.newsletter__intro,.faq__answer,.faq-cta__sub, .commission-note p,.form-note,.field-hint,.price .u,.step p{ color:#DAD6CA; } .about__body p.lead,.faq__answer strong{ color:var(--ink); } .eyebrow,.infoline .k,.field label{ color:var(--stone); } .eyebrow{ color:var(--gilt); } .tlink,.infoline a.v:hover{ color:var(--gilt); } .tlink:hover{ color:#EFD9A0; } /* ───── butoane: umplut deschis + ghost cu chenar ───── */ :root{ --btn-green:#D9B873; --btn-hover:#EFD9A0; } .btn,.btn--gilt,.e404__btn,.verify button.go,form button[type="submit"]{ color:#2c2f2a!important; box-shadow:inset 0 0 0 3px var(--btn-green),inset 0 0 0 4px rgba(44,47,42,.4); } .btn:hover,.btn--gilt:hover,.e404__btn:hover,.verify button.go:hover,form button[type="submit"]:hover{ color:#2c2f2a!important; box-shadow:inset 0 0 0 3px var(--btn-hover),inset 0 0 0 4px rgba(44,47,42,.4),0 12px 22px -12px rgba(0,0,0,.6); } .btn--ghost{ color:var(--gilt)!important; box-shadow:inset 0 0 0 1px rgba(217,184,115,.85),inset 0 0 0 4px var(--canvas),inset 0 0 0 5px rgba(217,184,115,.4); } .btn--ghost:hover{ color:#2c2f2a!important; box-shadow:inset 0 0 0 4px var(--btn-green),inset 0 0 0 5px rgba(44,47,42,.4),0 12px 22px -12px rgba(0,0,0,.6); } .filter,.page-btn,.craft span{ border-color:rgba(237,233,223,.4); color:var(--ink); } .filter:hover,.page-btn:hover{ border-color:var(--gilt); color:var(--gilt); background:rgba(217,184,115,.1); } .filter.active,.page-btn.active,#galerie .filter.active{ background:var(--gilt); border-color:var(--gilt); color:#2c2f2a; } .lb__action button.btn{ color:#2c2f2a!important; background:var(--gilt); box-shadow:inset 0 0 0 3px var(--gilt),inset 0 0 0 4px rgba(44,47,42,.4); } .lb__action button.btn:hover{ background:#EFD9A0; box-shadow:inset 0 0 0 3px #EFD9A0,inset 0 0 0 4px rgba(44,47,42,.4); } /* ───── formulare ───── */ #contactForm .field input,#contactForm .field textarea,#contactForm .field select, #orderForm .field input,#orderForm .field textarea,#orderForm .field select{ background-color:rgba(0,0,0,.18); border-color:rgba(237,233,223,.35); color:var(--ink); } #contactForm .field input:hover,#contactForm .field textarea:hover,#contactForm .field select:hover, #orderForm .field input:hover,#orderForm .field textarea:hover,#orderForm .field select:hover{ background-color:rgba(0,0,0,.26); border-color:rgba(237,233,223,.7); } #contactForm .field input:focus,#contactForm .field textarea:focus,#contactForm .field select:focus, #orderForm .field input:focus,#orderForm .field textarea:focus,#orderForm .field select:focus{ background-color:rgba(0,0,0,.3); border-color:var(--gilt); box-shadow:0 0 0 3px rgba(217,184,115,.2); } #contactForm .field input::placeholder,#contactForm .field textarea::placeholder, #orderForm .field input::placeholder,#orderForm .field textarea::placeholder{ color:rgba(237,233,223,.5); } #contactForm .field select option,#orderForm .field select option{ background:#3d403a; color:var(--ink); } #contactForm .field input:-webkit-autofill,#orderForm .field input:-webkit-autofill{ -webkit-box-shadow:0 0 0 100px #3d403a inset; -webkit-text-fill-color:#EDE9DF; } .drop{ border-color:rgba(237,233,223,.4); } .drop:hover{ border-color:var(--gilt); background:rgba(217,184,115,.08); } /* ───── carduri / casete ───── */ #contact .contact-glass,.faq-cta,#orderForm,.order-ok{ background:var(--paper); border-color:rgba(217,184,115,.45); box-shadow:inset 0 0 0 5px var(--paper),inset 0 0 0 6px rgba(217,184,115,.4),0 34px 64px -40px rgba(0,0,0,.6); } .newsletter{ background:var(--canvas-2); } .lang__menu{ background:var(--paper); border-color:rgba(237,233,223,.3); } /* ───── logo auriu (mai puțin saturat), exact, prin mască — bară + footer ───── */ .nav .brand,.foot .brand{ position:relative; display:block; line-height:0; } .nav .brand img,.foot .brand img{ opacity:0; } .nav .brand::after,.foot .brand::after{ content:""; position:absolute; inset:0; background:#D8C08C; -webkit-mask:url(logo-alb.png) center/contain no-repeat; mask:url(logo-alb.png) center/contain no-repeat; } /* ───── lucrarea reprezentativă: mai mică, fire aurii ───── */ .hang{ max-width:380px; width:100%; justify-self:center; margin-inline:auto; } .hang__wire{ width:2px; background:linear-gradient(to top,#D8C08C,rgba(216,192,140,.2)); } @media(min-width:901px){ .hero__grid{ grid-template-columns:1.2fr .8fr; } } /* ───── galerie: model Nick Alm — grilă simplă, legendă italică sub imagine ───── */ .gallery{ grid-template-columns:repeat(4,1fr); gap:clamp(28px,3vw,52px) clamp(16px,1.8vw,28px); } @media(max-width:1100px){ .gallery{ grid-template-columns:repeat(3,1fr); } } @media(max-width:760px){ .gallery{ grid-template-columns:repeat(2,1fr); } } .gallery .work::before{ display:none; } .gallery .work__frame{ border:0; border-radius:0; box-shadow:none; background:transparent; } .gallery .work:hover .work__frame,.gallery .work:focus-visible .work__frame{ transform:none; box-shadow:none; } .gallery .work:hover .work__img,.gallery .work:focus-visible .work__img{ transform:none; filter:none; opacity:.85; } .gallery .work__frame::after{ display:none; } .gallery .work__meta{ flex-direction:column; align-items:center; gap:2px; padding:14px 4px 0; text-align:center; } .gallery .work__title{ font-family:var(--ff-body); font-style:italic; font-size:19px; font-weight:400; color:var(--ink); } .gallery .work__dim{ font-style:italic; font-size:16px; color:var(--stone); margin-top:0; } .gallery .work__cat{ display:none; } .gallery .work::after{ content:attr(data-cat-label); display:block; text-align:center; padding:2px 4px 0; font-family:var(--ff-body); font-style:italic; font-size:16px; color:var(--stone); } /* butonul „Comandă o lucrare" din bară: umplut auriu */ .nav .btn,.nav .nav__links .nav__cta-m{ background:#D9B873; border-color:#D9B873; color:#2c2f2a!important; } .nav .btn:hover,.nav .nav__links .nav__cta-m:hover{ background:#EFD9A0; border-color:#EFD9A0; color:#2c2f2a!important; } /* ───── firele lucrării: mai lungi, gradient complet transparent sus ───── */ .hang{ padding-top:96px; } .hang__wire{ height:96px; width:2px; background:linear-gradient(to top,#D8C08C 0%,rgba(216,192,140,.55) 45%,rgba(216,192,140,0) 100%); } /* ───── pagini legale / verificare / 404 ───── */ .topbar .brand,.e404__logowrap{ position:relative; display:block; line-height:0; } .e404__logowrap{ display:inline-block; margin-bottom:46px; } .topbar .brand img,.e404__logo{ opacity:0; } .e404__logo{ margin-bottom:0!important; } .topbar .brand::after,.e404__logowrap::after{ content:""; position:absolute; inset:0; background:#D8C08C; -webkit-mask:url(logo-alb.png) center/contain no-repeat; mask:url(logo-alb.png) center/contain no-repeat; } .topbar .brand img{ height:44px!important; } .topbar{ background:#42453E; border-bottom:1px solid rgba(217,184,115,.3); } .topbar .wrap{ display:grid; grid-template-columns:1fr auto 1fr; align-items:center; column-gap:24px; padding:18px var(--pad)!important; } .topbar .brand{ justify-self:center; } .topbar__back{ justify-self:start; font-family:var(--ff-body); font-style:italic; font-size:18px; color:#D9B873!important; border-bottom:1px solid transparent; } .topbar__back:hover{ color:#EFD9A0!important; text-decoration:none; } .topbar .lang{ justify-self:end; color:#D9B873; } .topbar .lang a{ color:#D9B873; } .topbar .lang a.active{ color:#EFD9A0; } .legal main .wrap{ max-width:760px; } .legal .lede,.verify .lede,.verify .note p,.e404__text{ color:#DAD6CA; } .legal .box{ background:var(--paper); border-color:rgba(217,184,115,.4); box-shadow:inset 0 0 0 4px var(--paper),inset 0 0 0 5px rgba(217,184,115,.35); } .legal .fill{ background:rgba(217,184,115,.15); border-bottom-color:#D9B873; color:var(--ink); } .legal main a:hover{ color:#EFD9A0; } .legal .topbar__back{ border-bottom:0; } .legal .eyebrow::before{ background:var(--gilt); } .legal hr{ border-top-color:var(--line); } footer{ background:var(--panel); } body.verify{ --cream:#3d403a; --ink:#EDE9DF; --stone:#CFCBBE; --gilt:#D9B873; --gilt-deep:#EFD9A0; --panel:#363933; --hair:#6B6E65; --paper:#53574E; } .verify header{ background:#42453E; border-bottom:1px solid rgba(217,184,115,.3); } .verify header .bar{ max-width:none; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; padding:18px var(--pad)!important; } .verify .mark{ justify-self:center; text-align:center; color:#D8C08C; } .verify .mark small{ color:#D9B873; } .verify .lang{ justify-self:end; display:flex; border-color:rgba(217,184,115,.55); } .verify .lang button{ color:#D9B873; background:transparent; } .verify .lang button[aria-pressed="true"]{ background:#D9B873; color:#2c2f2a; } .verify input[type=text]{ background:rgba(0,0,0,.18); border-color:rgba(237,233,223,.35); color:var(--ink); } .verify input[type=text]:hover,.verify input[type=text]:focus{ background:rgba(0,0,0,.3); } .verify input[type=text]::placeholder{ color:rgba(237,233,223,.45); } .verify .panel,.verify .res.ok{ background:var(--paper); border-color:rgba(217,184,115,.45); box-shadow:inset 0 0 0 5px var(--paper),inset 0 0 0 6px rgba(217,184,115,.35),0 34px 64px -40px rgba(0,0,0,.6); } .verify .res.no{ background:#5a4a43; border-color:#a77d68; } .verify .res.no .tag{ color:#F0C2A8; } .verify .res .thumb{ background:rgba(0,0,0,.2); } .verify footer{ border-top-color:var(--hair); color:var(--stone); } .verify footer a{ color:#D9B873; } .verify .res-body .thumb,.verify .meta td{ border-color:var(--hair); } .e404__rule{ background:#D9B873; } .e404__label{ color:#D9B873; } .e404__num{ color:var(--ink); } @media(max-width:560px){ .topbar__back{ font-size:16px; } .verify header .bar{ column-gap:10px; } } body.verify{ color:#EDE9DF; background:radial-gradient(ellipse at 70% 0%,#575a51 0%,#494C45 55%,#3d403a 100%); } .verify h1,.verify .panel h2,.verify .res h3,.verify .res .info h3{ color:#EDE9DF; } .verify .panel p.hint{ color:#CFCBBE; } .verify .meta td{ color:#EDE9DF; } .verify .meta td:first-child{ color:#CFCBBE; } /* ───── PORTOFOLIU: categorii + grilă de miniaturi pătrate (model Nick Alm) ───── */ .pf [hidden]{ display:none!important; } .pf .pfhub{ display:flex; justify-content:center; margin-top:clamp(24px,4vw,48px); } .pf .pfbox{ width:min(1100px,100%); background:#2b2e29; border:1px solid rgba(217,184,115,.85); padding:clamp(28px,5vw,72px) clamp(20px,5vw,72px); } .pf .pftiles{ list-style:none; display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(16px,3vw,44px); } .pf .pftile{ display:block; text-align:center; text-decoration:none; border:0; } .pf .pftile__img{ display:block; aspect-ratio:1/1; overflow:hidden; background:#1d1f1c; } .pf .pftile__img img{ width:100%; height:100%; object-fit:cover; display:block; transition:opacity .3s,transform .6s; } .pf .pftile:hover .pftile__img img,.pf .pftile:focus-visible .pftile__img img{ opacity:.82; transform:scale(1.04); } .pf .pftile__label{ display:block; margin-top:14px; font-variant-caps:all-small-caps; letter-spacing:.2em; font-size:21px; color:#D9B873; } .pf .pftile:hover .pftile__label{ color:#EFD9A0; } .pf #gallery{ display:grid; grid-template-columns:repeat(4,1fr); gap:8px; width:min(1100px,100%); margin:clamp(24px,4vw,40px) auto 0; background:#2b2e29; border:1px solid rgba(217,184,115,.85); padding:clamp(18px,4vw,56px); } .pf .gallery .work__frame{ aspect-ratio:1/1; border-radius:0; } .pf .gallery .work__meta,.pf .gallery .work::after{ display:none; } .pf .gallery .work:hover .work__img,.pf .gallery .work:focus-visible .work__img{ opacity:.8; } .pf .work[data-status] .work__frame::before{ width:11px; height:11px; top:7px; right:7px; box-shadow:0 0 0 1.5px rgba(251,246,232,.85),0 1px 4px rgba(0,0,0,.4); } .pf .pagination{ display:none!important; } @media(max-width:900px){ .pf #gallery{ grid-template-columns:repeat(3,1fr); } } @media(max-width:700px){ .pf .pftiles{ grid-template-columns:repeat(2,1fr); } } @media(max-width:560px){ .pf #gallery{ grid-template-columns:repeat(2,1fr); gap:6px; } } /* ───── NEWSLETTER (MailerLite) în stilul site-ului ───── */ .ml-form-embedContainer,.ml-form-embedContainer .ml-form-embedWrapper, .ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody, .ml-form-embedContainer .ml-form-embedWrapper .ml-form-successBody{ background:transparent!important; box-shadow:none!important; border:0!important; } .ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody{ padding:0!important; } .ml-form-embedContainer .ml-form-fieldRow{ margin-bottom:14px!important; } .ml-form-embedContainer .ml-form-fieldRow input, .ml-form-embedContainer .ml-form-fieldRow input.form-control{ background:rgba(0,0,0,.18)!important; border:1px solid rgba(237,233,223,.35)!important; border-radius:2px!important; color:#EDE9DF!important; font-family:"EB Garamond",Georgia,serif!important; font-size:19px!important; font-style:italic; padding:12px 14px!important; height:auto!important; box-shadow:none!important; transition:border-color .2s,background-color .2s; } .ml-form-embedContainer .ml-form-fieldRow input::placeholder{ color:rgba(237,233,223,.5)!important; } .ml-form-embedContainer .ml-form-fieldRow input:hover{ border-color:rgba(237,233,223,.7)!important; background:rgba(0,0,0,.26)!important; } .ml-form-embedContainer .ml-form-fieldRow input:focus{ border-color:#D9B873!important; background:rgba(0,0,0,.3)!important; box-shadow:0 0 0 3px rgba(217,184,115,.2)!important; outline:none!important; } .ml-form-embedContainer .ml-form-fieldRow.ml-error input,.ml-form-embedContainer .ml-error input{ border-color:#E0A58E!important; } .ml-form-embedContainer .ml-form-fieldRow label,.ml-form-embedContainer label, .ml-form-embedContainer .label-description{ color:#CFCBBE!important; font-family:"EB Garamond",Georgia,serif!important; } .ml-form-embedContainer .ml-form-embedPermissions,.ml-form-embedContainer .ml-form-embedPermissions *{ color:#B9B5A8!important; font-family:"EB Garamond",Georgia,serif!important; } .ml-form-embedContainer .ml-form-embedPermissions a{ color:#D9B873!important; } .ml-form-embedContainer .ml-form-embedSubmit{ margin:0!important; } .ml-form-embedContainer .ml-form-embedSubmit button.primary{ width:100%; background:#D9B873!important; border:1px solid #D9B873!important; border-radius:0!important; color:#2C2F2A!important; font-family:"EB Garamond",Georgia,serif!important; font-weight:500!important; font-variant-caps:all-small-caps; letter-spacing:.16em; font-size:20px!important; padding:13px 22px!important; height:auto!important; box-shadow:inset 0 0 0 3px #D9B873,inset 0 0 0 4px rgba(44,47,42,.4)!important; cursor:pointer; transition:background-color .2s,border-color .2s,transform .2s; } .ml-form-embedContainer .ml-form-embedSubmit button.primary:hover{ background:#EFD9A0!important; border-color:#EFD9A0!important; transform:translateY(-2px); box-shadow:inset 0 0 0 3px #EFD9A0,inset 0 0 0 4px rgba(44,47,42,.4),0 12px 22px -12px rgba(0,0,0,.6)!important; } .ml-form-embedContainer .ml-form-embedSubmit button.primary:focus-visible{ outline:2px solid #EFD9A0; outline-offset:3px; } .ml-form-embedContainer .ml-form-embedSubmit button.loading{ background:#D9B873!important; border-color:#D9B873!important; } .ml-form-embedContainer .ml-form-embedSubmitLoad:after{ border-color:#2C2F2A transparent #2C2F2A transparent!important; } /* mesaj după abonare */ .ml-form-embedContainer .ml-form-successContent h4,.ml-form-embedContainer .ml-form-successContent p{ color:#EDE9DF!important; font-family:"EB Garamond",Georgia,serif!important; text-align:center; } .ml-form-embedContainer .ml-form-successContent h4{ font-family:"Fraunces",Georgia,serif!important; font-weight:400!important; color:#D9B873!important; font-size:24px!important; } .ml-form-embedContainer .ml-form-successContent p{ font-size:19px!important; } .ml-form-embedContainer .ml-form-recaptcha,.ml-form-embedContainer .ml-form-embedBody .ml-error{ color:#E0A58E!important; } /* ───── newsletter: casetă cu chenar dublu, ca formularul de contact ───── */ .newsletter .newsletter__inner{ position:relative; max-width:720px; margin:0 auto; text-align:center; padding:clamp(28px,4.5vw,52px) clamp(22px,4vw,56px); background:var(--paper); border:1px solid rgba(217,184,115,.45); border-radius:4px; box-shadow:inset 0 0 0 5px var(--paper),inset 0 0 0 6px rgba(217,184,115,.4),0 34px 64px -40px rgba(0,0,0,.6); } .newsletter .newsletter__inner::before{ content:""; position:absolute; top:-1px; left:50%; transform:translateX(-50%); width:56px; height:2px; background:var(--gilt); } .newsletter .ml-embedded{ max-width:480px; margin:0 auto; } .newsletter.section-pad{ padding:clamp(40px,5vw,72px) 0; } /* ───── hover: text închis pe auriu, în toate cazurile ───── */ .btn:hover,.btn:focus-visible,.btn--ghost:hover,.btn--gilt:hover,.nav .btn:hover,.nav .nav__links .nav__cta-m:hover, .nav .nav__links a.btn:hover,.lb__action button.btn:hover,.verify button.go:hover,.e404__btn:hover,form button[type="submit"]:hover, .btn:hover *,.btn--ghost:hover *,.btn--gilt:hover *{ color:#2c2f2a!important; -webkit-text-fill-color:#2c2f2a!important; } .ml-form-embedContainer .ml-form-embedSubmit button.primary:hover, .ml-form-embedContainer .ml-form-embedSubmit button.primary:focus, .ml-form-embedContainer .ml-form-embedSubmit button.primary:active, .ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-embedSubmit button.primary:hover, .ml-form-embedContainer .ml-form-embedSubmit button.primary:hover *{ color:#2C2F2A!important; -webkit-text-fill-color:#2C2F2A!important; background:#EFD9A0!important; border-color:#EFD9A0!important; } /* ───── fire mai scurte + mai puțin spațiu sub meniu ───── */ .hang{ padding-top:44px; } .hang__wire{ height:44px; } .hero{ padding-top:clamp(20px,3.2vw,40px); } /* ───── meniu: text mai deschis, ca linia aurie ───── */ .nav .nav__links a:not(.btn){ color:#EFD9A0; } .nav .nav__links a:not(.btn):hover, .nav .nav__links a[aria-current="page"],.nav .nav__links a[aria-current="true"], .nav .nav__links a:not(.btn)[aria-current]{ color:#FBEFCB; } .nav .nav__links a:not(.btn)::after{ background:#EFD9A0; } .nav .lang__btn{ color:#EFD9A0; } @media(max-width:900px){ .nav .nav__links a:not(.btn){ color:#EFD9A0; } .nav .nav__links a:not(.btn)[aria-current],.nav .nav__links a:not(.btn):hover,.nav .nav__links a:not(.btn):active{ color:#FBEFCB; } } /* ───── newsletter pe telefon: margini laterale ───── */ .newsletter .newsletter__inner{ width:calc(100% - 32px); box-sizing:border-box; } @media(max-width:600px){ .newsletter .newsletter__inner{ width:calc(100% - 32px); padding:28px 20px; } } /* ───── meniu telefon: animații ───── */ .nav .nav__toggle svg path{ transform-box:fill-box; transform-origin:center; transition:transform .45s cubic-bezier(.3,.7,.2,1),opacity .25s ease; } .nav .nav__toggle[aria-expanded="true"] svg path:nth-child(1){ transform:translateY(6px) rotate(45deg); } .nav .nav__toggle[aria-expanded="true"] svg path:nth-child(2){ opacity:0; transform:scaleX(.2); } .nav .nav__toggle[aria-expanded="true"] svg path:nth-child(3){ transform:translateY(-6px) rotate(-45deg); } @media(max-width:900px){ .nav .nav__links{ clip-path:inset(0 0 100% 0); transform:translateY(-18px); transition:clip-path .8s cubic-bezier(.25,.8,.25,1),transform .8s cubic-bezier(.25,.8,.25,1),opacity .45s ease .1s,visibility 0s linear .8s; } .nav .nav__links.open{ clip-path:inset(0 0 -60px 0); transform:none; opacity:1; visibility:visible; transition:clip-path .8s cubic-bezier(.25,.8,.25,1),transform .8s cubic-bezier(.25,.8,.25,1),opacity .35s ease,visibility 0s; } .nav .nav__links > *{ opacity:0; transform:translateY(-14px); transition:opacity .28s ease,transform .28s ease; } .nav .nav__links.open > *{ opacity:1; transform:none; transition:opacity .6s ease,transform .6s cubic-bezier(.25,.8,.25,1); } .nav .nav__links.open > *:nth-child(1){ transition-delay:.20s; } .nav .nav__links.open > *:nth-child(2){ transition-delay:.28s; } .nav .nav__links.open > *:nth-child(3){ transition-delay:.36s; } .nav .nav__links.open > *:nth-child(4){ transition-delay:.44s; } .nav .nav__links.open > *:nth-child(5){ transition-delay:.52s; } .nav .nav__links.open > *:nth-child(6){ transition-delay:.60s; } .nav .nav__links > *:nth-child(6){ transition-delay:0s; } .nav .nav__links > *:nth-child(5){ transition-delay:.04s; } .nav .nav__links > *:nth-child(4){ transition-delay:.08s; } .nav .nav__links > *:nth-child(3){ transition-delay:.12s; } .nav .nav__links > *:nth-child(2){ transition-delay:.16s; } .nav .nav__links > *:nth-child(1){ transition-delay:.20s; } } @media(prefers-reduced-motion:reduce){ .nav .nav__links,.nav .nav__links > *,.nav .nav__toggle svg path{ transition-duration:.01s!important; transition-delay:0s!important; } } /* ───── verifica: subsol fără fundal separat ───── */ .verify footer{ background:transparent!important; } /* ───── verifica: texte centrate ───── */ .verify main{ text-align:center; } .verify .eyebrow{ display:flex; justify-content:center; } .verify .lede{ margin-left:auto; margin-right:auto; } .verify .panel{ text-align:center; } .verify .res,.verify .note{ text-align:center; } .verify footer{ justify-content:center!important; align-items:center; gap:14px 44px; text-align:center; } @media(max-width:600px){ .verify footer{ flex-direction:column; align-items:center!important; gap:8px; } } @media(max-width:480px){ .verify .bar{ gap:8px; } .verify .mark{ font-size:17px; } .verify .mark small{ letter-spacing:1.4px; font-size:9px; } .verify .bar__sp{ display:none; } .verify .bar{ justify-content:space-between; } .verify .mark{ text-align:left; } } @media(max-width:480px){ .verify .bar{ display:flex!important; } .verify .lang{ margin-left:auto; } } /* ───── Lucrări selectate: 3 chenare aurii egale, lucrarea necropită în interior (compatibil Safari/mobil) ───── */ .gallery--trio{ gap:clamp(36px,5vw,72px) clamp(32px,4.5vw,64px)!important; align-items:flex-start!important; --pad:clamp(14px,1.8vw,24px); } .gallery--trio .work__frame{ aspect-ratio:4/5!important; box-sizing:border-box; position:relative!important; padding:0!important; background:#2B2E29!important; border:1px solid rgba(217,184,115,.85)!important; overflow:hidden!important; display:block!important; } .gallery--trio .work__frame picture{ position:absolute!important; top:var(--pad); right:var(--pad); bottom:var(--pad); left:var(--pad); display:block!important; } .gallery--trio .work__img{ position:absolute!important; top:0; left:0; width:100%!important; height:100%!important; max-width:none!important; max-height:none!important; object-fit:contain!important; object-position:center!important; display:block; } @media(max-width:640px){ .gallery--trio{ --pad:14px; } } /* fără bulinele de disponibilitate */ .work[data-status] .work__frame::before,.pf .work[data-status] .work__frame::before{ display:none!important; content:none!important; } /* Lucrări selectate: mai răsfirate spre margini */ @media(min-width:900px){ .gallery--trio{ justify-content:space-between!important; gap:40px clamp(10px,1.2vw,18px)!important; width:calc(100% + clamp(10px,1.5vw,25px)); margin-left:calc(clamp(10px,1.5vw,25px) / -2); } } /* hero: text și lucrare mai spre centru */ @media(min-width:901px){ .hero__grid{ grid-template-columns:1.1fr .9fr!important; max-width:1260px; margin-inline:auto; gap:clamp(48px,7vw,110px)!important; } } /* Safari/iOS: sub bara de sus a telefonului pagina nu mai se vede prin spațiul de deasupra meniului */ .nav::before{ content:""; position:absolute; left:0; right:0; bottom:100%; height:300px; background:var(--bar); pointer-events:none; } /* meniu mobil: fără întunecarea paginii din spatele meniului deschis */ .menu-scrim,body.menu-open .menu-scrim{ background:transparent!important; } /* portofoliu: subcategorii */ .pf .pftiles{ grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); } .pf .pftiles:has(> li:nth-child(4)){ grid-template-columns:repeat(4,1fr); } .pf .pftile__img--empty{ background:#1d1f1c; border:1px solid rgba(217,184,115,.35); } .pf .pfempty{ grid-column:1/-1; text-align:center; color:#CFCBBE; font-style:italic; padding:24px 0; } @media(max-width:700px){ .pf .pftiles,.pf .pftiles:has(> li:nth-child(4)){ grid-template-columns:repeat(2,1fr); } } /* butonul „înapoi”: mai vizibil, același font */ .backlink{ display:inline-flex!important; align-items:center; gap:8px; color:#EFD9A0!important; font-size:19px!important; padding:9px 20px 10px!important; border:1px solid rgba(217,184,115,.85)!important; background:rgba(217,184,115,.08); text-decoration:none; transition:background-color .2s,color .2s,border-color .2s; } .backlink:hover,.backlink:focus-visible{ background:#D9B873!important; color:#2C2F2A!important; border-color:#D9B873!important; } /* portofoliu: casete cu dimensiune constantă, indiferent câte lucrări sunt */ .pf .pfbox,.pf #gallery{ min-height:min(380px,62vw); box-sizing:border-box; } .pf .pftiles,.pf .pftiles:has(> li:nth-child(4)){ display:flex!important; flex-wrap:wrap; justify-content:center; --g:clamp(16px,3vw,44px); --cols:4; gap:var(--g); } .pf .pftiles > li{ flex:0 0 calc((100% - (var(--cols) - 1) * var(--g)) / var(--cols)); min-width:0; } .pf .pfempty{ flex:1 1 100%; } .pf #gallery{ display:flex!important; flex-wrap:wrap; justify-content:center; align-content:flex-start; --g:8px; --cols:4; gap:var(--g); } .pf #gallery > .work{ flex:0 0 calc((100% - (var(--cols) - 1) * var(--g)) / var(--cols)); min-width:0; max-width:none; } .pf #gallery[hidden]{ display:none!important; } @media(max-width:900px){ .pf #gallery{ --cols:3; } } @media(max-width:700px){ .pf .pftiles,.pf .pftiles:has(> li:nth-child(4)){ --cols:2; } } @media(max-width:560px){ .pf #gallery{ --cols:2; --g:6px; } } /* încărcare fotografii în formularul de comandă */ .drop{ background:rgba(0,0,0,.22)!important; border:1.5px dashed rgba(217,184,115,.6)!important; border-radius:0!important; color:#EDE9DF; } .drop:hover{ background:rgba(217,184,115,.1)!important; border-color:#D9B873!important; } .drop b{ color:#F4F0E6; } .drop small{ color:#CFCBBE; } .drop svg{ stroke:#D9B873; } .thumb{ border:1px solid rgba(217,184,115,.6)!important; border-radius:0!important; color:#EDE9DF; background:#2B2E29; } /* lucrarea reprezentativă: proporțiile reale ale pozei (fără decupare) */ .hero__panel{ aspect-ratio:1100/1380!important; } .hero__panel img{ width:100%; height:100%; object-fit:cover; } /* lucrarea reprezentativă: fără chenar în jurul pozei */ .hero__panel{ border:0!important; border-radius:0!important; } /* lucrarea reprezentativă: fără „salvează imaginea” / tragere / apăsare lungă */ .hero__panel img{ -webkit-user-drag:none; user-select:none; -webkit-user-select:none; -webkit-touch-callout:none; pointer-events:none; } .hero__panel{ -webkit-touch-callout:none; user-select:none; -webkit-user-select:none; } /* ───── animații formulare ───── */ .fx-invalid input,.fx-invalid select,.fx-invalid textarea{ border-color:#E7B9A0!important; box-shadow:0 0 0 3px rgba(231,185,160,.18)!important; } .fx-invalid label{ color:#F0C2A8!important; } .fx-shake{ animation:fxShake .5s cubic-bezier(.36,.07,.19,.97) both; } @keyframes fxShake{ 10%,90%{ transform:translateX(-2px); } 20%,80%{ transform:translateX(5px); } 30%,50%,70%{ transform:translateX(-9px); } 40%,60%{ transform:translateX(9px); } } .form-ok{ display:none; text-align:center; background:var(--paper); color:var(--panel-ink); border:1px solid rgba(217,184,115,.45); box-shadow:inset 0 0 0 5px var(--paper),inset 0 0 0 6px rgba(217,184,115,.4); padding:38px 28px; } .form-ok.show{ display:block; } .form-ok h3,.order-ok h3{ font-family:var(--ff-display); font-weight:500; font-size:24px; margin:0 0 8px; color:#F4F0E6; } .form-ok p{ color:#CFCBBE; font-size:16px; max-width:44ch; margin:0 auto; } .form-ok svg,.order-ok svg{ width:52px; height:52px; stroke:#D9B873; fill:none; stroke-width:1.6; margin-bottom:14px; overflow:visible; } .fx-in{ animation:fxOkIn .6s cubic-bezier(.2,.8,.2,1) both; } @keyframes fxOkIn{ from{ opacity:0; transform:translateY(16px) scale(.96); } to{ opacity:1; transform:none; } } .fx-in svg{ animation:fxPop .6s cubic-bezier(.2,1.5,.4,1) .15s both; } @keyframes fxPop{ from{ transform:scale(.3) rotate(-25deg); opacity:0; } to{ transform:none; opacity:1; } } .fx-in svg circle{ stroke-dasharray:70; stroke-dashoffset:70; animation:fxDraw .8s ease .2s forwards; } .fx-in svg path{ stroke-dasharray:30; stroke-dashoffset:30; animation:fxDraw .6s ease .55s forwards; } @keyframes fxDraw{ to{ stroke-dashoffset:0; } } .fx-in h3{ animation:fxUp .5s ease .6s both; } .fx-in p,.fx-in a{ animation:fxUp .5s ease .75s both; } @keyframes fxUp{ from{ opacity:0; transform:translateY(10px); } to{ opacity:1; transform:none; } } @media(prefers-reduced-motion:reduce){ .fx-shake,.fx-in,.fx-in *{ animation:none!important; } .fx-in svg path,.fx-in svg circle{ stroke-dashoffset:0!important; } } /* ── buton „Vezi în 3D” pe poza lucrării ── */ .view3d{position:absolute;left:50%;bottom:clamp(10px,2.6%,18px);transform:translateX(-50%);z-index:4;display:inline-flex;align-items:center;gap:8px;white-space:nowrap;padding:8px 16px;border:1px solid rgba(217,184,115,.85);border-radius:3px;background:rgba(36,38,33,.28);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);color:#EDE9DF!important;font-family:var(--ff-body);font-size:14px;line-height:1;letter-spacing:.06em;text-decoration:none!important;cursor:pointer;transition:background .25s,border-color .25s,color .25s} .view3d svg{width:17px;height:17px;flex:none;stroke:#D9B873;fill:none;stroke-width:1.5;stroke-linejoin:round;stroke-linecap:round;transition:stroke .25s} .view3d:hover,.view3d:focus-visible{background:rgba(217,184,115,.92);border-color:#D9B873;color:#2C2F2A!important} .view3d:hover svg,.view3d:focus-visible svg{stroke:#2C2F2A} .gallery .view3d{font-size:13px;padding:7px 13px} #lbFrame{position:relative} /* „Vezi în 3D” sub lucrarea reprezentativă */ .view3d-row{display:flex;justify-content:center;margin-top:26px} .view3d-row .view3d{position:static;transform:none;background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;font-size:15px;padding:10px 22px} .view3d-row .view3d:hover,.view3d-row .view3d:focus-visible{background:#D9B873;border-color:#D9B873;color:#2C2F2A!important} /* lucrare vândută — pagina principală */ .hero__sold{position:absolute;top:12px;right:12px;z-index:3;font-family:var(--ff-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;padding:6px 13px;border-radius:100px;background:rgba(25,22,18,.80);color:#e8e2d6;pointer-events:none} .view3d-row{flex-direction:column;align-items:center;gap:14px} .hero__sold-note{margin:0;text-align:center;font-family:var(--ff-body);font-style:italic;font-size:16px;color:var(--stone)} .hero__sold-note a{color:#D9B873;text-decoration:none;white-space:nowrap;border-bottom:1px solid rgba(217,184,115,.4)} .hero__sold-note a:hover{color:#EFD9A0;border-bottom-color:#EFD9A0} /* portofoliu: categorii, subcategorii și lucrări — fără chenar, 4 pe rând (4:5), prima aliniată cu titlul, ultima cu marginea din dreapta */ .pf .pfhub{ width:100%; } .pf .pfbox{ width:100%; margin-inline:auto; background:none; border:0; padding:0; min-height:0; } .pf .pftiles,.pf .pftiles:has(> li:nth-child(3)),.pf .pftiles:has(> li:nth-child(4)){ display:flex!important; flex-wrap:wrap; justify-content:flex-start; gap:64px 28px; } .pf .pftiles > li:not(.pfempty),.pf .pftiles:has(> li:nth-child(4)) > li:not(.pfempty){ flex:0 0 calc((100% - 84px) / 4); min-width:0; } .pf .pftile__img{ aspect-ratio:4/5; } .pf .pftile__label{ margin-top:18px; } .pf #gallery{ display:grid!important; grid-template-columns:repeat(4,minmax(0,1fr)); gap:64px 28px; width:100%; margin:clamp(24px,4vw,40px) auto 0; background:none; border:0; padding:0; min-height:0; } .pf #gallery > .work{ flex:none; width:auto; max-width:none; min-width:0; } .pf .gallery .work__frame{ aspect-ratio:4/5; } @media(max-width:700px){ .pf .pftiles,.pf .pftiles:has(> li:nth-child(3)),.pf .pftiles:has(> li:nth-child(4)){ gap:40px 16px; } .pf .pftiles > li:not(.pfempty),.pf .pftiles:has(> li:nth-child(4)) > li:not(.pfempty){ flex:0 0 calc((100% - 16px) / 2); } .pf #gallery{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:36px 14px; } } /* lucrările din orice categorie / subcategorie: proporția lor originală, aranjate în coloane de JS (compatibil Safari) */ .pf #gallery.masonry{ display:block!important; position:relative; } .pf #gallery.masonry > .work{ position:absolute; display:block; margin:0; box-sizing:border-box; } .pf #gallery.masonry > .work.hide{ display:none; } .pf #gallery.masonry .work__frame{ aspect-ratio:auto; height:100%; } .pf #gallery.masonry .work__img{ height:100%; object-fit:cover; } /* spațiu mai mic între bara de meniu și butonul „înapoi” (Întrebări, Portofoliu, Comandă) */ main > section.section-pad:first-of-type{ padding-top:clamp(22px,2.6vw,34px)!important; } /* portofoliu: animație la hover pe lucrări — înclinare 3D după cursor, ridicare, zoom cu paralaxă, colțuri aurii care se desenează și titlul care urcă */ .pf .gallery .work__cap{ display:none; } @media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){ .pf .gallery .work{ transition:none; } .pf .gallery .work:hover,.pf .gallery .work:focus-visible{ z-index:6; } .pf .gallery .work__frame{ position:relative; overflow:hidden; background:#2f332d; transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateY(var(--ty,0px)) scale(var(--sc,1)); -webkit-transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateY(var(--ty,0px)) scale(var(--sc,1)); transition:transform .6s cubic-bezier(.2,.7,.2,1),box-shadow .5s ease; } .pf .gallery .work:hover .work__frame,.pf .gallery .work:focus-visible .work__frame{ --sc:1.045; --ty:-10px; transition:transform .16s ease-out,box-shadow .4s ease; box-shadow:0 34px 46px -22px rgba(0,0,0,.75),0 12px 20px -12px rgba(0,0,0,.55); } .pf .gallery .work__img{ transform:scale(1) translate(0,0); transition:transform .7s cubic-bezier(.2,.7,.2,1),filter .5s ease,opacity .3s; } .pf .gallery .work:hover .work__img,.pf .gallery .work:focus-visible .work__img{ opacity:1; filter:brightness(1.07) contrast(1.04) saturate(1.05); transform:scale(1.12) translate(calc(var(--px,0) * -14px),calc(var(--py,0) * -14px)); } /* titlul urcă de jos */ .pf .gallery .work__cap{ display:block; position:absolute; left:0; right:0; bottom:0; z-index:2; padding:64px 18px 16px; text-align:left; background:linear-gradient(to top,rgba(22,24,20,.97) 0%,rgba(22,24,20,.92) 38%,rgba(22,24,20,.6) 72%,rgba(22,24,20,0) 100%); transform:translateY(102%); opacity:0; transition:transform .45s cubic-bezier(.2,.7,.2,1),opacity .35s ease; pointer-events:none; } .pf .gallery .work:has(.view3d) .work__cap{ padding-bottom:66px; } .pf .gallery .work__cap b{ display:block; font-weight:400; font-style:italic; font-size:20px; line-height:1.2; color:#EDE9DF; } .pf .gallery .work__cap i{ display:block; font-style:normal; font-family:var(--ff-mono,monospace); font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:#D9B873; margin-top:6px; } .pf .gallery .work:hover .work__cap,.pf .gallery .work:focus-visible .work__cap{ transform:none; opacity:1; transition-delay:.06s; } } #lbFrame .work__cap{ display:none!important; } /* buton meniu: umplut auriu cu contur interior închis, ca butoanele din hero */ .nav a.btn.nav__cta,.nav .nav__links a.nav__cta-m{ background:#D9B873!important; border-color:#D9B873!important; color:#2c2f2a!important; box-shadow:inset 0 0 0 3px #D9B873,inset 0 0 0 4px rgba(44,47,42,.4)!important; } .nav a.btn.nav__cta:hover,.nav .nav__links a.nav__cta-m:hover{ background:#EFD9A0!important; border-color:#EFD9A0!important; color:#2c2f2a!important; box-shadow:inset 0 0 0 3px #EFD9A0,inset 0 0 0 4px rgba(44,47,42,.4)!important; } .about__body p.lead + p{ display:flow-root; } /* Inițială ornamentală (D / A) din vectorul victorian */ /* bară meniu: spațiu între elemente, logo centrat */ .nav .nav__inner{ max-width:none; margin-inline:0; column-gap:40px; } @media(min-width:901px){ .nav .nav__links{ gap:clamp(18px,1.9vw,30px); } .nav .nav__right{ gap:clamp(12px,1.4vw,18px); } .nav .btn.nav__cta{ padding:10px clamp(14px,1.4vw,20px) 12px; } } @media(min-width:901px) and (max-width:1180px){ .nav .nav__links a:not(.btn){ letter-spacing:.1em!important; font-size:.92em; } } @media(min-width:901px){ .nav .nav__inner{ padding-left:clamp(24px,2.6vw,48px)!important; padding-right:clamp(24px,2.6vw,48px)!important; column-gap:32px; } .nav .nav__links{ gap:clamp(16px,1.5vw,28px); } } @media(min-width:901px) and (max-width:1400px){ .nav .nav__links a:not(.btn){ letter-spacing:.08em!important; font-size:.88em; } .nav .btn.nav__cta{ letter-spacing:.1em; font-size:.9em; } } @media(min-width:901px) and (max-width:1150px){ /* coloane laterale egale, ca logoul să stea exact pe centru și pe ecranele medii */ .nav .nav__inner{ grid-template-columns:1fr auto 1fr; column-gap:20px; } .nav .nav__links{ gap:16px; } .nav .brand{ grid-column:2; justify-self:center; } } @media(min-width:901px) and (max-width:1100px){ .nav .nav__links{ gap:12px; } .nav .nav__links a:not(.btn){ letter-spacing:.05em!important; } } /* portofoliu: lățimea de ieri (mai larg decât restul site-ului) */ .pf #magazin .wrap{ max-width:1640px; padding-left:clamp(20px,4vw,72px); padding-right:clamp(20px,4vw,72px); } /* verifica: buton înapoi (RO/EN) */ .verify .backlink{ margin-bottom:26px; } .verify .backlink[data-en]{ display:none!important; } html[lang=en] .verify .backlink[data-ro]{ display:none!important; } html[lang=en] .verify .backlink[data-en]{ display:inline-flex!important; } /* consimțământ politică de confidențialitate */ .consent{display:flex;gap:12px;align-items:flex-start;margin:20px 0 4px;font-size:16px;line-height:1.45;color:#DAD6CA;cursor:pointer} .consent input{margin-top:4px;width:18px;height:18px;flex:none;accent-color:#D9B873;cursor:pointer} .consent a{color:#D9B873;text-decoration:underline;text-underline-offset:3px} .consent a:hover{color:#EFD9A0} .consent .req{color:#D9B873} /* ───── Portofoliu: categorii cu cifre romane (galerie decalată) ───── */ .pf .pfcats{ margin-top:clamp(20px,3vw,40px); } .pf .pfcat{ position:relative; overflow:hidden; border-top:1px solid rgba(217,184,115,.25); padding:clamp(36px,5vw,64px) 0 clamp(48px,7vw,96px); min-height:clamp(420px,52vw,640px); } .pf .pfcat__num{ position:absolute; z-index:0; font-family:var(--ff-display); font-size:clamp(150px,30vw,420px); line-height:1; color:transparent; -webkit-text-stroke:1.5px rgba(217,184,115,.4); pointer-events:none; user-select:none; } .pf .pfcat:nth-child(odd) .pfcat__num{ right:14%; top:-4%; } .pf .pfcat:nth-child(even) .pfcat__num{ left:14%; top:-4%; } .pf .pfcat__head{ position:relative; z-index:2; display:flex; justify-content:space-between; align-items:flex-start; gap:24px; flex-wrap:wrap; } .pf .pfcat__t{ font-family:var(--ff-display); font-size:clamp(14px,1.2vw,16px); letter-spacing:.14em; text-transform:uppercase; line-height:1.6; } .pf .pfcat__t small{ display:block; font-size:.86em; letter-spacing:.08em; color:var(--stone); } .pf .pfcat__d{ max-width:34ch; font-size:15px; line-height:1.5; color:#d9d5c8; } .pf .pfcat__d a{ display:inline-block; margin-top:10px; color:var(--gilt); font-family:var(--ff-mono); font-size:12px; letter-spacing:.12em; text-transform:uppercase; border-bottom:1px solid currentColor; } .pf .pfcat__d a:hover{ color:#EFD9A0; } .pf .pfcat__row{ position:relative; z-index:2; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(24px,5vw,80px); align-items:start; margin-top:clamp(28px,4vw,56px); padding:0 clamp(0px,3vw,48px); } .pf .pfcat__row.n1{ grid-template-columns:minmax(0,.42fr); } .pf .pfcat__row.n2{ grid-template-columns:repeat(2,minmax(0,.42fr)); } .pf .pfcat__row .pfc:nth-child(2){ margin-top:clamp(20px,5vw,70px); } .pf .pfcat__row .pfc:nth-child(3){ margin-top:clamp(0px,2vw,26px); } .pf .pfc{ display:block; text-align:left; cursor:pointer; background:none; border:0; color:inherit; font:inherit; padding:0; } .pf .pfc picture,.pf .pfc img{ display:block; width:100%; height:auto; } .pf .pfc img{ box-shadow:0 26px 50px -24px rgba(0,0,0,.7); transition:transform .6s ease, filter .4s ease; } .pf .pfc__mat{ background:#F1E9D6; padding:clamp(8px,1.2vw,16px); border:4px solid #2b2418; box-shadow:0 26px 50px -24px rgba(0,0,0,.7); } .pf .pfc__mat img{ box-shadow:none; } .pf .pfc:hover img,.pf .pfc:focus-visible img{ transform:scale(1.03); filter:brightness(1.06); } .pf .pfc__mat{ overflow:hidden; } .pf .pfc__cap{ margin-top:14px; font-size:15px; line-height:1.35; color:#d9d5c8; } .pf .pfc__cap b{ display:block; font-family:var(--ff-display); font-weight:400; font-size:clamp(17px,1.6vw,22px); color:var(--ink); } @media(max-width:700px){ .pf .pfcat__row,.pf .pfcat__row.n2{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; padding:0; } .pf .pfcat__row.n1{ grid-template-columns:minmax(0,.7fr); } .pf .pfcat__row .pfc:nth-child(3){ display:none; } .pf .pfcat__row .pfc:nth-child(2){ margin-top:28px; } } /* ───── footer cu pictură (Repin, Procesiune religioasă în gubernia Kursk) ───── */ footer,.verify footer,.verify footer.sitefoot{ position:relative; isolation:isolate; overflow:hidden; background:#42453E!important; border-top:1px solid rgba(217,184,115,.35)!important; } footer::before{ content:""; position:absolute; inset:0; z-index:-2; background:url(/footer-repin.jpg) 50% 42%/cover no-repeat; } footer::after{ content:""; position:absolute; inset:0; z-index:-1; background:rgba(30,32,28,.74); pointer-events:none; } .fcap{ position:absolute; right:28px; bottom:16px; z-index:3; text-align:right; font-size:12.5px; line-height:1.5; color:rgba(237,233,223,.82); } .fcap i{ font-style:italic; display:block; font-size:13.5px; color:rgba(237,233,223,.95); } .fcap b{ font-weight:400; display:block; letter-spacing:.14em; text-transform:uppercase; font-size:11px; color:rgba(217,184,115,.95); margin-top:3px; } @media(max-width:700px){ .fcap{ left:16px; right:16px; bottom:14px; text-align:center; } footer,.verify footer.sitefoot{ padding-bottom:calc(100px + env(safe-area-inset-bottom,0px))!important; } } /* Portofoliu: lucrări în design cu cifre romane + animații */ .pf .pfcat--all{ min-height:0; border-top:0; padding-top:clamp(8px,2vw,24px); } .pf .pfcat--all .pfcat__num{ top:-2%; right:6%; left:auto; } .pf .pfcat__row.all{ grid-template-columns:repeat(3,minmax(0,1fr)); row-gap:clamp(36px,6vw,80px); margin-top:clamp(10px,2vw,30px); } .pf .pfcat__row.all .pfc:nth-child(3n+2){ margin-top:clamp(20px,5vw,70px); } .pf .pfcat__row.all .pfc:nth-child(3n+3){ margin-top:clamp(0px,2vw,26px); } .pf .pfcat__row.all .pfc:nth-child(3n+1){ margin-top:0; } @media(max-width:700px){ .pf .pfcat__row.all{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px 18px; } .pf .pfcat__row.all .pfc:nth-child(3n+3){ display:block; margin-top:0; } .pf .pfcat__row.all .pfc:nth-child(2n+2){ margin-top:28px; } .pf .pfcat__row.all .pfc:nth-child(2n+1){ margin-top:0; } } @keyframes pfUp{ from{opacity:0;transform:translate3d(0,34px,0)} to{opacity:1;transform:none} } @keyframes pfFade{ from{opacity:0} to{opacity:1} } @keyframes pfNum{ from{opacity:0;transform:translate3d(0,40px,0) scale(.97)} to{opacity:1;transform:none} } @media(prefers-reduced-motion:no-preference){ .pf .pfcat .pfcat__num,.pf .pfcat .pfcat__head,.pf .pfcat .pfc{ opacity:0; } .pf .pfcat.in .pfcat__num{ animation:pfNum 1.3s cubic-bezier(.2,.7,.2,1) both; } .pf .pfcat.in .pfcat__head{ animation:pfUp .9s cubic-bezier(.2,.7,.2,1) .15s both; } .pf .pfcat.in .pfc{ animation:pfUp 1s cubic-bezier(.2,.7,.2,1) both; animation-delay:calc(.3s + min(var(--i,0),10)*.09s); } .pf .pfcat.in{ border-top-color:rgba(217,184,115,.25); } .pf .pfcat{ border-top-color:transparent; transition:border-color 1s ease; } .pf h1#pTitle,.pf .pf-eyebrow,#pEyebrow,#backlink{ animation:pfUp .9s cubic-bezier(.2,.7,.2,1) both; } #pEyebrow,#backlink{ animation-delay:.05s; } h1#pTitle{ animation-delay:.15s; } } /* Lucrări: alternanță stânga–dreapta cu detalii */ .pf .pfw-list{ position:relative; z-index:2; display:flex; flex-direction:column; gap:clamp(70px,11vw,170px); padding:clamp(20px,4vw,60px) 0 clamp(40px,6vw,90px); } .pf .pfw{ position:relative; display:grid; grid-template-columns:minmax(0,.42fr) minmax(0,.58fr); align-items:center; gap:clamp(24px,6vw,110px); } .pf .pfw.r{ grid-template-columns:minmax(0,.58fr) minmax(0,.42fr); } .pf .pfw.r .pfw__img{ order:2; } .pf .pfw.r .pfw__txt{ order:1; text-align:right; align-items:flex-end; } .pf .pfw.l{ margin-right:clamp(0px,8vw,120px); } .pf .pfw.r{ margin-left:clamp(0px,8vw,120px); } .pf .pfw__n{ position:absolute; z-index:0; top:50%; transform:translateY(-50%); font-family:var(--ff-display); font-size:clamp(120px,22vw,320px); line-height:1; color:transparent; -webkit-text-stroke:1.2px rgba(217,184,115,.28); pointer-events:none; } .pf .pfw.l .pfw__n{ left:36%; } .pf .pfw.r .pfw__n{ right:36%; } .pf .pfw__img{ position:relative; z-index:2; } .pf .pfw__img img{ max-height:78vh; width:auto; max-width:100%; margin:0 auto; } .pf .pfw__txt{ position:relative; z-index:2; display:flex; flex-direction:column; align-items:flex-start; gap:10px; max-width:36ch; } .pf .pfw.r .pfw__txt{ margin-left:auto; } .pf .pfw__txt h2{ font-family:var(--ff-display); font-weight:400; font-size:clamp(26px,3.2vw,44px); line-height:1.1; letter-spacing:.02em; margin:0; } .pf .pfw__c,.pf .pfw__d{ margin:0; font-size:15px; line-height:1.5; color:#d9d5c8; } .pf .pfw__d{ color:var(--stone); } .pf .pfw__s{ font-family:var(--ff-mono); font-size:11px; letter-spacing:.14em; text-transform:uppercase; padding:5px 10px; border:1px solid rgba(217,184,115,.4); color:var(--gilt); } .pf .pfw__s--no{ color:var(--stone); border-color:rgba(255,255,255,.2); } .pf .pfw__price{ font-family:var(--ff-display); font-size:24px; } .pf .pfw__price small{ display:block; font-family:var(--ff-mono); font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--stone); } .pf .pfw__b{ margin-top:8px; font-family:var(--ff-mono); font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--gilt); border-bottom:1px solid var(--gilt); padding-bottom:3px; cursor:pointer; } .pf .pfw__b:hover{ color:#EFD9A0; } @media(max-width:760px){ .pf .pfw,.pf .pfw.r{ grid-template-columns:minmax(0,1fr); margin:0; gap:20px; } .pf .pfw.r .pfw__img{ order:0; } .pf .pfw.r .pfw__txt{ order:1; text-align:left; align-items:flex-start; margin:0; } .pf .pfw.l .pfw__n,.pf .pfw.r .pfw__n{ left:auto; right:0; top:0; transform:none; } } @media(prefers-reduced-motion:no-preference){ .pf .pfw .pfw__img,.pf .pfw .pfw__txt,.pf .pfw .pfw__n{ opacity:0; } .pf .pfw.in .pfw__n{ animation:pfNum 1.3s cubic-bezier(.2,.7,.2,1) both; } .pf .pfw.in .pfw__img{ animation:pfUp 1s cubic-bezier(.2,.7,.2,1) both; } .pf .pfw.in .pfw__txt{ animation:pfUp 1s cubic-bezier(.2,.7,.2,1) .25s both; } } /* zig-zag mai strâns: rândurile se suprapun pe verticală */ .pf .pfw-list{ gap:0; } .pf .pfw{ align-items:start; } .pf .pfw + .pfw{ margin-top:calc(-1 * clamp(70px,13vw,210px)); } .pf .pfw__txt{ align-self:start; padding-top:clamp(10px,3vw,50px); } .pf .pfw__n{ top:30%; } @media(max-width:760px){ .pf .pfw + .pfw{ margin-top:56px; } .pf .pfw-list{ gap:0; } } .pf .pfw__txt{ max-width:clamp(180px,21vw,270px); } .pf .pfw__txt h2{ font-size:clamp(22px,2.4vw,34px); } @media(max-width:760px){ .pf .pfw__txt{ max-width:none; } .pf .pfw__txt h2{ font-size:26px; } } /* text lipit de propria lucrare, suprapunere mai mică */ .pf .pfw{ align-items:center; } .pf .pfw__txt{ align-self:center; padding-top:0; } .pf .pfw__n{ top:50%; } .pf .pfw + .pfw{ margin-top:calc(-1 * clamp(30px,6vw,100px)); } .pf .pfw.l .pfw__txt{ margin-left:clamp(0px,2vw,30px); } .pf .pfw.r .pfw__txt{ margin-right:clamp(0px,2vw,30px); } @media(max-width:760px){ .pf .pfw + .pfw{ margin-top:56px; } } #gallery[hidden],#pfHub[hidden],#pfCats[hidden]{ display:none!important; } .pf #gallery.masonry[hidden]{ display:none!important; } /* mobil: același zig-zag ca pe desktop */ @media(max-width:760px){ .pf .pfw,.pf .pfw.l{ grid-template-columns:minmax(0,.54fr) minmax(0,.46fr); gap:12px; margin:0; align-items:center; } .pf .pfw.r{ grid-template-columns:minmax(0,.46fr) minmax(0,.54fr); gap:12px; margin:0; } .pf .pfw.r .pfw__img{ order:2; } .pf .pfw.r .pfw__txt{ order:1; text-align:right; align-items:flex-end; margin:0; } .pf .pfw.l .pfw__txt{ margin:0; } .pf .pfw__txt{ max-width:none; gap:6px; } .pf .pfw__txt h2{ font-size:19px; } .pf .pfw__c,.pf .pfw__d{ font-size:12.5px; line-height:1.4; } .pf .pfw__s{ font-size:9.5px; padding:3px 7px; } .pf .pfw__price{ font-size:18px; } .pf .pfw__b{ font-size:10.5px; } .pf .pfw + .pfw{ margin-top:-28px; } .pf .pfw-list{ padding-top:10px; } .pf .pfw.l .pfw__n{ left:30%; right:auto; top:50%; transform:translateY(-50%); } .pf .pfw.r .pfw__n{ right:30%; left:auto; top:50%; transform:translateY(-50%); } .pf .pfw__n{ font-size:130px; } } @media(max-width:760px){ .pf .pfw,.pf .pfw.l{ grid-template-columns:minmax(0,.5fr) minmax(0,.5fr); } .pf .pfw.r{ grid-template-columns:minmax(0,.5fr) minmax(0,.5fr); } .pf .pfw + .pfw{ margin-top:-4px; } } @keyframes pfUp{from{opacity:0;transform:translate3d(0,34px,0)}to{opacity:1;transform:none}}@keyframes pfNum{from{opacity:0;transform:translate3d(0,40px,0) scale(.97)}to{opacity:1;transform:none}} /* Lucrări: alternanță stânga–dreapta cu detalii */ .hz .pfw-list{ position:relative; z-index:2; display:flex; flex-direction:column; gap:clamp(70px,11vw,170px); padding:clamp(20px,4vw,60px) 0 clamp(40px,6vw,90px); } .hz .pfw{ position:relative; display:grid; grid-template-columns:minmax(0,.42fr) minmax(0,.58fr); align-items:center; gap:clamp(24px,6vw,110px); } .hz .pfw.r{ grid-template-columns:minmax(0,.58fr) minmax(0,.42fr); } .hz .pfw.r .pfw__img{ order:2; } .hz .pfw.r .pfw__txt{ order:1; text-align:right; align-items:flex-end; } .hz .pfw.l{ margin-right:clamp(0px,8vw,120px); } .hz .pfw.r{ margin-left:clamp(0px,8vw,120px); } .hz .pfw__n{ position:absolute; z-index:0; top:50%; transform:translateY(-50%); font-family:var(--ff-display); font-size:clamp(120px,22vw,320px); line-height:1; color:transparent; -webkit-text-stroke:1.2px rgba(217,184,115,.28); pointer-events:none; } .hz .pfw.l .pfw__n{ left:36%; } .hz .pfw.r .pfw__n{ right:36%; } .hz .pfw__img{ position:relative; z-index:2; } .hz .pfw__img img{ max-height:78vh; width:auto; max-width:100%; margin:0 auto; } .hz .pfw__txt{ position:relative; z-index:2; display:flex; flex-direction:column; align-items:flex-start; gap:10px; max-width:36ch; } .hz .pfw.r .pfw__txt{ margin-left:auto; } .hz .pfw__txt h2{ font-family:var(--ff-display); font-weight:400; font-size:clamp(26px,3.2vw,44px); line-height:1.1; letter-spacing:.02em; margin:0; } .hz .pfw__c,.hz .pfw__d{ margin:0; font-size:15px; line-height:1.5; color:#d9d5c8; } .hz .pfw__d{ color:var(--stone); } .hz .pfw__s{ font-family:var(--ff-mono); font-size:11px; letter-spacing:.14em; text-transform:uppercase; padding:5px 10px; border:1px solid rgba(217,184,115,.4); color:var(--gilt); } .hz .pfw__s--no{ color:var(--stone); border-color:rgba(255,255,255,.2); } .hz .pfw__price{ font-family:var(--ff-display); font-size:24px; } .hz .pfw__price small{ display:block; font-family:var(--ff-mono); font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--stone); } .hz .pfw__b{ margin-top:8px; font-family:var(--ff-mono); font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--gilt); border-bottom:1px solid var(--gilt); padding-bottom:3px; cursor:pointer; } .hz .pfw__b:hover{ color:#EFD9A0; } @media(max-width:760px){ .hz .pfw,.hz .pfw.r{ grid-template-columns:minmax(0,1fr); margin:0; gap:20px; } .hz .pfw.r .pfw__img{ order:0; } .hz .pfw.r .pfw__txt{ order:1; text-align:left; align-items:flex-start; margin:0; } .hz .pfw.l .pfw__n,.hz .pfw.r .pfw__n{ left:auto; right:0; top:0; transform:none; } } @media(prefers-reduced-motion:no-preference){ .hz .pfw .pfw__img,.hz .pfw .pfw__txt,.hz .pfw .pfw__n{ opacity:0; } .hz .pfw.in .pfw__n{ animation:pfNum 1.3s cubic-bezier(.2,.7,.2,1) both; } .hz .pfw.in .pfw__img{ animation:pfUp 1s cubic-bezier(.2,.7,.2,1) both; } .hz .pfw.in .pfw__txt{ animation:pfUp 1s cubic-bezier(.2,.7,.2,1) .25s both; } } /* zig-zag mai strâns: rândurile se suprapun pe verticală */ .hz .pfw-list{ gap:0; } .hz .pfw{ align-items:start; } .hz .pfw + .pfw{ margin-top:calc(-1 * clamp(70px,13vw,210px)); } .hz .pfw__txt{ align-self:start; padding-top:clamp(10px,3vw,50px); } .hz .pfw__n{ top:30%; } @media(max-width:760px){ .hz .pfw + .pfw{ margin-top:56px; } .hz .pfw-list{ gap:0; } } .hz .pfw__txt{ max-width:clamp(180px,21vw,270px); } .hz .pfw__txt h2{ font-size:clamp(22px,2.4vw,34px); } @media(max-width:760px){ .hz .pfw__txt{ max-width:none; } .hz .pfw__txt h2{ font-size:26px; } } /* text lipit de propria lucrare, suprapunere mai mică */ .hz .pfw{ align-items:center; } .hz .pfw__txt{ align-self:center; padding-top:0; } .hz .pfw__n{ top:50%; } .hz .pfw + .pfw{ margin-top:calc(-1 * clamp(30px,6vw,100px)); } .hz .pfw.l .pfw__txt{ margin-left:clamp(0px,2vw,30px); } .hz .pfw.r .pfw__txt{ margin-right:clamp(0px,2vw,30px); } @media(max-width:760px){ .hz .pfw + .pfw{ margin-top:56px; } } /* mobil: același zig-zag ca pe desktop */ @media(max-width:760px){ .hz .pfw,.hz .pfw.l{ grid-template-columns:minmax(0,.54fr) minmax(0,.46fr); gap:12px; margin:0; align-items:center; } .hz .pfw.r{ grid-template-columns:minmax(0,.46fr) minmax(0,.54fr); gap:12px; margin:0; } .hz .pfw.r .pfw__img{ order:2; } .hz .pfw.r .pfw__txt{ order:1; text-align:right; align-items:flex-end; margin:0; } .hz .pfw.l .pfw__txt{ margin:0; } .hz .pfw__txt{ max-width:none; gap:6px; } .hz .pfw__txt h2{ font-size:19px; } .hz .pfw__c,.hz .pfw__d{ font-size:12.5px; line-height:1.4; } .hz .pfw__s{ font-size:9.5px; padding:3px 7px; } .hz .pfw__price{ font-size:18px; } .hz .pfw__b{ font-size:10.5px; } .hz .pfw + .pfw{ margin-top:-28px; } .hz .pfw-list{ padding-top:10px; } .hz .pfw.l .pfw__n{ left:30%; right:auto; top:50%; transform:translateY(-50%); } .hz .pfw.r .pfw__n{ right:30%; left:auto; top:50%; transform:translateY(-50%); } .hz .pfw__n{ font-size:130px; } } @media(max-width:760px){ .hz .pfw,.hz .pfw.l{ grid-template-columns:minmax(0,.5fr) minmax(0,.5fr); } .hz .pfw.r{ grid-template-columns:minmax(0,.5fr) minmax(0,.5fr); } .hz .pfw + .pfw{ margin-top:-4px; } } .hz{position:relative;overflow:hidden} .hz .work{cursor:pointer;opacity:1!important;transform:none!important;width:auto;margin-bottom:0} .hz .pfw__img{display:block;padding:0;background:none;border:0;height:auto;aspect-ratio:auto} .hz .pfw__img picture,.hz .pfw__img img{display:block;width:100%;height:auto} .hz .pfw__img img{box-shadow:0 26px 50px -24px rgba(0,0,0,.7);transition:transform .6s ease,filter .4s ease} .hz .work:hover .pfw__img img{transform:scale(1.03);filter:brightness(1.06)} .hz .pfw__img img{max-height:78vh;width:auto;max-width:100%;margin:0 auto} .hz .pfw__b{background:none;border:0;border-top:0} .hz .pfw__end{text-align:center;margin-top:clamp(40px,6vw,80px)} .hz .pfw__txt h3{ font-family:var(--ff-display); font-weight:400; font-size:clamp(22px,2.4vw,34px); line-height:1.1; letter-spacing:.02em; margin:0; } @media(max-width:760px){ .hz .pfw__txt h3{ font-size:19px; } } /* Lucrări selectate: 3 lucrări ca pe hub */ .hz3 .pfcats{ margin-top:clamp(20px,3vw,40px); } .hz3 .pfcat{ position:relative; overflow:hidden; border-top:1px solid rgba(217,184,115,.25); padding:clamp(36px,5vw,64px) 0 clamp(48px,7vw,96px); min-height:clamp(420px,52vw,640px); } .hz3 .pfcat__num{ position:absolute; z-index:0; font-family:var(--ff-display); font-size:clamp(150px,30vw,420px); line-height:1; color:transparent; -webkit-text-stroke:1.5px rgba(217,184,115,.4); pointer-events:none; user-select:none; } .hz3 .pfcat:nth-child(odd) .pfcat__num{ right:14%; top:-4%; } .hz3 .pfcat:nth-child(even) .pfcat__num{ left:14%; top:-4%; } .hz3 .pfcat__head{ position:relative; z-index:2; display:flex; justify-content:space-between; align-items:flex-start; gap:24px; flex-wrap:wrap; } .hz3 .pfcat__t{ font-family:var(--ff-display); font-size:clamp(14px,1.2vw,16px); letter-spacing:.14em; text-transform:uppercase; line-height:1.6; } .hz3 .pfcat__t small{ display:block; font-size:.86em; letter-spacing:.08em; color:var(--stone); } .hz3 .pfcat__d{ max-width:34ch; font-size:15px; line-height:1.5; color:#d9d5c8; } .hz3 .pfcat__d a{ display:inline-block; margin-top:10px; color:var(--gilt); font-family:var(--ff-mono); font-size:12px; letter-spacing:.12em; text-transform:uppercase; border-bottom:1px solid currentColor; } .hz3 .pfcat__d a:hover{ color:#EFD9A0; } .hz3 .pfcat__row{ position:relative; z-index:2; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(24px,5vw,80px); align-items:start; margin-top:clamp(28px,4vw,56px); padding:0 clamp(0px,3vw,48px); } .hz3 .pfcat__row.n1{ grid-template-columns:minmax(0,.42fr); } .hz3 .pfcat__row.n2{ grid-template-columns:repeat(2,minmax(0,.42fr)); } .hz3 .pfcat__row .pfc:nth-child(2){ margin-top:clamp(20px,5vw,70px); } .hz3 .pfcat__row .pfc:nth-child(3){ margin-top:clamp(0px,2vw,26px); } .hz3 .pfc{ display:block; text-align:left; cursor:pointer; background:none; border:0; color:inherit; font:inherit; padding:0; } .hz3 .pfc picture,.hz3 .pfc img{ display:block; width:100%; height:auto; } .hz3 .pfc img{ box-shadow:0 26px 50px -24px rgba(0,0,0,.7); transition:transform .6s ease, filter .4s ease; } .hz3 .pfc:hover img,.hz3 .pfc:focus-visible img{ transform:scale(1.03); filter:brightness(1.06); } .hz3 .pfc__cap{ margin-top:14px; font-size:15px; line-height:1.35; color:#d9d5c8; } .hz3 .pfc__cap b{ display:block; font-family:var(--ff-display); font-weight:400; font-size:clamp(17px,1.6vw,22px); color:var(--ink); } .hz3 .pfcat--all{ min-height:0; border-top:0; padding-top:clamp(8px,2vw,24px); } .hz3 .pfcat--all .pfcat__num{ top:-2%; right:6%; left:auto; } .hz3 .pfcat__row.all{ grid-template-columns:repeat(3,minmax(0,1fr)); row-gap:clamp(36px,6vw,80px); margin-top:clamp(10px,2vw,30px); } .hz3 .pfcat__row.all .pfc:nth-child(3n+2){ margin-top:clamp(20px,5vw,70px); } .hz3 .pfcat__row.all .pfc:nth-child(3n+3){ margin-top:clamp(0px,2vw,26px); } .hz3 .pfcat__row.all .pfc:nth-child(3n+1){ margin-top:0; } @media(max-width:700px){ .hz3 .pfcat__row,.hz3 .pfcat__row.n2{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; padding:0; } .hz3 .pfcat__row.n1{ grid-template-columns:minmax(0,.7fr); } .hz3 .pfcat__row .pfc:nth-child(3){ display:none; } .hz3 .pfcat__row .pfc:nth-child(2){ margin-top:28px; } } .hz3{padding:clamp(10px,2vw,30px) 0 clamp(30px,5vw,70px)} .hz3 .pfcat__row{margin-top:0} .hz3 .pfc{opacity:1} @media(prefers-reduced-motion:no-preference){.hz3 .pfc{opacity:0}.hz3.in .pfc{animation:pfUp 1s cubic-bezier(.2,.7,.2,1) both;animation-delay:calc(.1s + var(--i,0)*.12s)}} .hz3{padding-bottom:clamp(60px,8vw,110px)} /* hz3: neutralizează stilul vechi .work, ca să fie identic cu hub-ul */ .hz3 .work{transition:none} .hz3 .work::before,.hz3 .work__frame::after{display:none!important} .hz3 .work__frame{aspect-ratio:auto!important;height:auto!important;overflow:visible;background:none;border-radius:0;padding:0;box-shadow:none!important;transform:none!important} .hz3 .work__frame picture{display:block;position:static!important;width:100%;height:auto} .hz3 .work__img,.hz3 .work__frame img{display:block;position:static!important;width:100%!important;height:auto!important;object-fit:fill;box-shadow:0 26px 50px -24px rgba(0,0,0,.7);transition:transform .6s ease,filter .4s ease} .hz3 .work:hover .work__img,.hz3 .work:focus-visible .work__img{transform:scale(1.03);filter:brightness(1.06)} .hz3 .pfc__cap{margin-top:14px;font-size:15px;line-height:1.35;color:#d9d5c8} .hz3 .pfc__cap b{display:block;font-family:var(--ff-display);font-weight:400;font-size:clamp(17px,1.6vw,22px);color:var(--ink)} .hz3 + .gallery-hint{margin-top:clamp(40px,5vw,70px)!important} /* animații direcționale: de sus, din părți, de jos */ @keyframes pfL{from{opacity:0;transform:translate3d(-110px,0,0)}to{opacity:1;transform:none}} @keyframes pfR{from{opacity:0;transform:translate3d(110px,0,0)}to{opacity:1;transform:none}} @keyframes pfD{from{opacity:0;transform:translate3d(0,-60px,0)}to{opacity:1;transform:none}} @keyframes pfB{from{opacity:0;transform:translate3d(0,70px,0)}to{opacity:1;transform:none}} .hz3{overflow-x:clip} @media(prefers-reduced-motion:no-preference){ /* hub / categorii */ .pf .pfcat.in .pfcat__num{ animation:pfD 1.3s cubic-bezier(.2,.7,.2,1) both; } .pf .pfcat.in .pfcat__head{ animation:pfD .9s cubic-bezier(.2,.7,.2,1) .1s both; } .pf .pfcat.in .pfc:nth-child(3n+1){ animation:pfL 1.1s cubic-bezier(.2,.7,.2,1) both; animation-delay:.25s; } .pf .pfcat.in .pfc:nth-child(3n+2){ animation:pfB 1.1s cubic-bezier(.2,.7,.2,1) both; animation-delay:.4s; } .pf .pfcat.in .pfc:nth-child(3n+3){ animation:pfR 1.1s cubic-bezier(.2,.7,.2,1) both; animation-delay:.55s; } /* lucrări zig-zag */ .pf .pfw.in .pfw__n{ animation:pfD 1.3s cubic-bezier(.2,.7,.2,1) both; } .pf .pfw.l.in .pfw__img{ animation:pfL 1.1s cubic-bezier(.2,.7,.2,1) both; } .pf .pfw.r.in .pfw__img{ animation:pfR 1.1s cubic-bezier(.2,.7,.2,1) both; } .pf .pfw.in .pfw__txt{ animation:pfB 1s cubic-bezier(.2,.7,.2,1) .3s both; } /* prima pagină */ .hz3.in .pfc:nth-child(1){ animation:pfL 1.1s cubic-bezier(.2,.7,.2,1) both; animation-delay:.1s; } .hz3.in .pfc:nth-child(2){ animation:pfB 1.1s cubic-bezier(.2,.7,.2,1) both; animation-delay:.25s; } .hz3.in .pfc:nth-child(3){ animation:pfR 1.1s cubic-bezier(.2,.7,.2,1) both; animation-delay:.4s; } /* titlu pagină: de sus */ .pf h1#pTitle,#pEyebrow,#backlink{ animation-name:pfD; } } @media(max-width:760px){ @keyframes pfL{from{opacity:0;transform:translate3d(-50px,0,0)}to{opacity:1;transform:none}} @keyframes pfR{from{opacity:0;transform:translate3d(50px,0,0)}to{opacity:1;transform:none}} } /* fără linii între secțiunile din portofoliu */ .pf .pfcat,.pf .pfcat.in,.pf .pfcat--all{ border-top:0!important; border-top-color:transparent!important; } @media(max-width:700px){ .hz3 .pfcat__row .pfc:nth-child(3){ display:block; margin-top:0; } } /* animații direcționale pe tot site-ul (anim.js) */ body{overflow-x:clip} @keyframes dxT{from{opacity:0;transform:translate3d(0,-46px,0)}to{opacity:1;transform:none}} @keyframes dxB{from{opacity:0;transform:translate3d(0,56px,0)}to{opacity:1;transform:none}} @keyframes dxL{from{opacity:0;transform:translate3d(-90px,0,0)}to{opacity:1;transform:none}} @keyframes dxR{from{opacity:0;transform:translate3d(90px,0,0)}to{opacity:1;transform:none}} @media(prefers-reduced-motion:no-preference){ .dx{opacity:0} .dx.reveal{transition:none;transform:none} .dx.dx-in{opacity:1;animation-duration:.95s;animation-timing-function:cubic-bezier(.2,.7,.2,1);animation-fill-mode:both;animation-delay:var(--dxd,0ms)} .dx-t.dx-in{animation-name:dxT} .dx-b.dx-in{animation-name:dxB} .dx-l.dx-in{animation-name:dxL} .dx-r.dx-in{animation-name:dxR} } @media(max-width:760px){ @keyframes dxL{from{opacity:0;transform:translate3d(-40px,0,0)}to{opacity:1;transform:none}} @keyframes dxR{from{opacity:0;transform:translate3d(40px,0,0)}to{opacity:1;transform:none}} } /* imagini cu fundal transparent (Gând în ramă): umbră care urmează conturul, fără chenar */ .pf .pfc img,.hz3 .pfc img,.hz3 .work__img,.hz .pfw__img img,.pf .pfw__img img{ box-shadow:none!important; filter:drop-shadow(0 22px 26px rgba(0,0,0,.45)); } .pf .pfc:hover img,.pf .pfc:focus-visible img,.hz3 .work:hover .work__img,.hz3 .pfc:hover img,.pf .pfw__img:hover img{ filter:drop-shadow(0 22px 26px rgba(0,0,0,.45)) brightness(1.06); } .lb__frame:has(img[src*="-rama-iulian"]),.lb__frame:has(source[srcset*="-rama-iulian"]){ border:0!important; background:none!important; border-radius:0!important; overflow:visible!important; box-shadow:none!important; } .lb__frame:has(img[src*="-rama-iulian"]) img{ filter:drop-shadow(0 18px 30px rgba(0,0,0,.5)); } /* meniu: în loc de chenar la hover, strălucire moale în jurul textului */ .nav .nav__pill{ background:radial-gradient(closest-side,rgba(251,239,203,.34) 0%,rgba(239,217,160,.18) 42%,rgba(239,217,160,.06) 68%,rgba(239,217,160,0) 100%)!important; box-shadow:none!important; border:0!important; border-radius:50%!important; transform:scale(1.55,2.3); transform-origin:center; filter:blur(3px); } .nav .nav__links a:not(.btn){ transition:color .25s ease,text-shadow .25s ease; } .nav .nav__links a:not(.btn):hover,.nav .nav__links a:not(.btn):focus-visible, .nav .nav__links a:not(.btn).under{ color:#FFF6DA!important; text-shadow:0 0 12px rgba(251,239,203,.65),0 0 26px rgba(239,217,160,.35); } .nav .nav__links a[aria-current="page"],.nav .nav__links a[aria-current="true"]{ text-shadow:0 0 10px rgba(251,239,203,.35); } /* meniu: doar scrisul strălucește, subtil */ .nav .nav__pill{ display:none!important; } .nav .nav__links a:not(.btn):hover,.nav .nav__links a:not(.btn):focus-visible, .nav .nav__links a:not(.btn).under{ color:#FFF3D2!important; text-shadow:0 0 9px rgba(251,239,203,.38),0 0 18px rgba(239,217,160,.16); } .nav .nav__links a[aria-current="page"],.nav .nav__links a[aria-current="true"]{ text-shadow:0 0 8px rgba(251,239,203,.2); } /* text de sub lucrări: mai mult aer față de ramă */ .pf .pfc__cap,.hz3 .pfc__cap{ margin-top:clamp(22px,2.2vw,30px); } /* meniu: strălucire mai vizibilă */ .nav .nav__links a:not(.btn):hover,.nav .nav__links a:not(.btn):focus-visible, .nav .nav__links a:not(.btn).under{ color:#FFF6DA!important; text-shadow:0 0 10px rgba(251,239,203,.6),0 0 22px rgba(239,217,160,.32); } .nav .nav__links a[aria-current="page"],.nav .nav__links a[aria-current="true"]{ text-shadow:0 0 9px rgba(251,239,203,.28); } /* logo: același glow la hover */ .nav .brand{ transition:filter .3s ease; } .nav .brand::after{ transition:background .3s ease; } .nav .brand:hover,.nav .brand:focus-visible{ filter:drop-shadow(0 0 7px rgba(251,239,203,.6)) drop-shadow(0 0 16px rgba(239,217,160,.3)); } .nav .brand:hover::after,.nav .brand:focus-visible::after{ background:#F6E7BC; } /* același glow și pe logoul din antetul paginilor de confidențialitate și verificare */ .topbar .brand,.verify .mark--logo{ transition:filter .3s ease; } .topbar .brand::after,.verify .mark--logo::after{ transition:background .3s ease; } .topbar .brand:hover,.topbar .brand:focus-visible,.verify .mark--logo:hover,.verify .mark--logo:focus-visible{ filter:drop-shadow(0 0 7px rgba(251,239,203,.6)) drop-shadow(0 0 16px rgba(239,217,160,.3)); } .topbar .brand:hover::after,.topbar .brand:focus-visible::after,.verify .mark--logo:hover::after,.verify .mark--logo:focus-visible::after{ background:#F6E7BC; } /* Lucrări selectate: lucrări mai mari, secțiune mai compactă */ .hz3 .wrap{ max-width:min(1560px,100%); } .hz3 .pfcat__row{ gap:clamp(20px,3.2vw,56px); padding:0 clamp(0px,1vw,16px); } .hz3,.hz3.in{ padding-top:0; padding-bottom:clamp(8px,1.5vw,20px); } .hz3 + .gallery-hint{ margin-top:clamp(14px,2vw,26px)!important; } #galerie.section-pad{ padding-bottom:clamp(36px,4vw,56px); } .hz3 .wrap{ max-width:min(1400px,100%); } /* ════════════════════════════════════════════════════════════════ PAGINĂ: preturi — retușuri după temă ════════════════════════════════════════════════════════════════ */ /* ───── pagina de prețuri ───── */ :where([data-page="preturi"]) .pr{position:relative;overflow:hidden} :where([data-page="preturi"]) .pr .prs{position:relative;display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(24px,6vw,100px);align-items:start;padding:clamp(34px,5vw,64px) 0} :where([data-page="preturi"]) .pr .prs.r{grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr)} :where([data-page="preturi"]) .pr .prs.r .prs__h{order:2;text-align:right} :where([data-page="preturi"]) .pr .prs.r .ptab{order:1} :where([data-page="preturi"]) .pr .prs__n{position:absolute;z-index:0;top:-2%;left:0;font-family:var(--ff-display);font-size:clamp(130px,20vw,300px);line-height:1;color:transparent;-webkit-text-stroke:1.3px rgba(217,184,115,.32);pointer-events:none;user-select:none} :where([data-page="preturi"]) .pr .prs.r .prs__n{left:auto;right:0} :where([data-page="preturi"]) .pr .prs__h{position:relative;z-index:2;padding-top:clamp(40px,6vw,90px)} :where([data-page="preturi"]) .pr .prs__h h2{font-family:var(--ff-display);font-weight:400;font-size:clamp(26px,3vw,42px);line-height:1.1;margin:0 0 12px} :where([data-page="preturi"]) .pr .prs__h p{margin:0;color:#d9d5c8;max-width:34ch;font-size:15.5px;line-height:1.55} :where([data-page="preturi"]) .pr .prs.r .prs__h p{margin-left:auto} :where([data-page="preturi"]) .pr .ptab{position:relative;z-index:2;width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums} :where([data-page="preturi"]) .pr .ptab th{font-family:var(--ff-mono);font-weight:400;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--stone);text-align:right;padding:0 0 12px;border-bottom:1px solid rgba(217,184,115,.4)} :where([data-page="preturi"]) .pr .ptab th:first-child,:where([data-page="preturi"]) .pr .ptab td:first-child{text-align:left} :where([data-page="preturi"]) .pr .ptab td{padding:15px 0;text-align:right;border-bottom:1px solid rgba(217,184,115,.14);font-size:18px;transition:color .25s ease,text-shadow .25s ease} :where([data-page="preturi"]) .pr .ptab td:first-child{font-family:var(--ff-display);color:var(--ink)} :where([data-page="preturi"]) .pr .ptab td.lei{color:#FFF3D2} :where([data-page="preturi"]) .pr .ptab td.eu,:where([data-page="preturi"]) .pr .ptab td.us{color:#d9d5c8} :where([data-page="preturi"]) .pr .ptab tbody tr:hover td{color:#FFF6DA;text-shadow:0 0 10px rgba(251,239,203,.5)} :where([data-page="preturi"]) .pr .pfrom{font-family:var(--ff-mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--stone);margin-right:8px} :where([data-page="preturi"]) .pr .pcur{max-width:70ch;color:#d9d5c8;font-size:15px;line-height:1.55;border-left:2px solid var(--gilt);padding:2px 0 2px 18px;margin:clamp(22px,3vw,34px) 0 0} :where([data-page="preturi"]) .pr .pext{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:clamp(14px,2vw,26px);margin:26px 0 18px} :where([data-page="preturi"]) .pr .pext div{border:1px solid rgba(217,184,115,.3);padding:20px 18px;background:rgba(30,32,28,.18)} :where([data-page="preturi"]) .pr .pext b{display:block;font-family:var(--ff-display);font-weight:400;font-size:clamp(28px,3vw,40px);color:#FFF3D2} :where([data-page="preturi"]) .pr .pext span{display:block;margin-top:6px;font-size:14.5px;color:#d9d5c8;line-height:1.4} /* titlurile categoriilor și capetele de coloană (lei/euro/dolari) în același auriu ca prețurile */ :where([data-page="preturi"]) .pr .ptab th:not(:first-child){color:#FFF3D2} /* titlurile categoriilor în auriul logoului */ :where([data-page="preturi"]) .pr .prs__h h2,:where([data-page="preturi"]) .pr .head h1{color:#D8C08C} /* procentele: același glow subtil ca rândurile de preț */ :where([data-page="preturi"]) .pr .pext b{transition:color .25s ease,text-shadow .25s ease} :where([data-page="preturi"]) .pr .pext div:hover b{color:#FFF6DA;text-shadow:0 0 10px rgba(251,239,203,.5)} /* căsuța cu procent se mărește ușor la hover (scale, ca să nu se bată cu animația de apariție) */ :where([data-page="preturi"]) .pr .pext div{transition:scale .3s ease,border-color .3s ease,box-shadow .3s ease} :where([data-page="preturi"]) .pr .pext div:hover{scale:1.05;border-color:rgba(217,184,115,.6);box-shadow:0 14px 30px -18px rgba(0,0,0,.55)} :where([data-page="preturi"]) .pr h2{font-weight:400} :where([data-page="preturi"]) .pr .pnote{font-size:13px;color:#b8b3a4;font-family:var(--ff-mono);letter-spacing:.02em;line-height:1.6;max-width:80ch} :where([data-page="preturi"]) .pr .pcta{text-align:center;padding:clamp(50px,7vw,90px) 0 clamp(30px,4vw,50px)} :where([data-page="preturi"]) .pr .pcta h2{font-family:var(--ff-display);font-weight:400;font-size:clamp(28px,3.4vw,46px);margin:0 0 12px} :where([data-page="preturi"]) .pr .pcta p{max-width:50ch;margin:0 auto 26px;color:#d9d5c8} :where([data-page="preturi"]) .pr .pbtns{display:flex;gap:14px;justify-content:center;flex-wrap:wrap} :where([data-page="preturi"]) .pr .pnav{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:clamp(34px,5vw,56px)} @media(max-width:760px){ :where([data-page="preturi"]) .pr .prs,:where([data-page="preturi"]) .pr .prs.r{grid-template-columns:minmax(0,1fr);gap:8px} :where([data-page="preturi"]) .pr .prs.r .prs__h{order:0;text-align:left} :where([data-page="preturi"]) .pr .prs.r .prs__h p{margin-left:0} :where([data-page="preturi"]) .pr .prs__h{padding-top:clamp(70px,22vw,110px)} :where([data-page="preturi"]) .pr .prs__n{font-size:150px;right:0;left:auto} :where([data-page="preturi"]) .pr .ptab td{font-size:16px;padding:13px 0} } /* ════════════════════════════════════════════════════════════════ PAGINĂ: verifica — retușuri după temă ════════════════════════════════════════════════════════════════ */ /* ───── animații: căutare + apariția cardului ───── */ :where([data-page="verifica"]) .scan{ display:flex; align-items:center; gap:18px; margin:18px 0 0; padding:18px 20px; border:1px solid rgba(217,184,115,.45); background:rgba(0,0,0,.18); position:relative; overflow:hidden; animation:rise .35s ease; } :where([data-page="verifica"]) .scan__ring{ position:relative; width:46px; height:46px; flex:none; } :where([data-page="verifica"]) .scan__ring svg{ width:100%; height:100%; animation:ringSpin 1.1s linear infinite; } :where([data-page="verifica"]) .scan__ring circle{ fill:none; stroke:#D9B873; stroke-width:2.2; stroke-linecap:round; stroke-dasharray:60 200; } :where([data-page="verifica"]) .scan__ring i{ position:absolute; left:50%; top:50%; width:10px; height:10px; margin:-5px 0 0 -5px; border-radius:50%; background:#D9B873; animation:dotPulse 1.1s ease-in-out infinite; } @keyframes ringSpin{ to{ transform:rotate(360deg); } } @keyframes dotPulse{ 0%,100%{ transform:scale(.6); opacity:.6; } 50%{ transform:scale(1.15); opacity:1; } } :where([data-page="verifica"]) .scan__txt{ min-width:0; } :where([data-page="verifica"]) .scan__code{ font-family:var(--mono); font-size:19px; letter-spacing:2px; color:#F4F0E6; white-space:nowrap; } :where([data-page="verifica"]) .scan__code b{ font-weight:500; color:#D9B873; display:inline-block; min-width:.8em; text-align:center; } :where([data-page="verifica"]) .scan__code b.done{ color:#EFD9A0; animation:charPop .35s ease; } @keyframes charPop{ 0%{ transform:scale(1.5); } 100%{ transform:none; } } :where([data-page="verifica"]) .scan__lbl{ font-family:var(--mono); font-size:12px; letter-spacing:1.5px; text-transform:uppercase; color:#CFCBBE; margin-top:6px; } :where([data-page="verifica"]) .scan__lbl::after{ content:""; display:inline-block; width:1.2em; text-align:left; animation:dots 1.2s steps(4) infinite; } @keyframes dots{ 0%{content:""} 25%{content:"."} 50%{content:".."} 75%{content:"..."} } :where([data-page="verifica"]) .res.res--anim{ position:relative; overflow:hidden; animation:cardIn .7s cubic-bezier(.2,.8,.2,1) both; } @keyframes cardIn{ from{ opacity:0; transform:translateY(18px) scale(.97); clip-path:inset(0 0 100% 0); } to{ opacity:1; transform:none; clip-path:inset(0 0 0 0); } } :where([data-page="verifica"]) .res--anim .seal{ position:relative; animation:stamp .7s cubic-bezier(.2,1.4,.4,1) .3s both; } :where([data-page="verifica"]) .res--anim .seal::after{ content:""; position:absolute; inset:-1px; border-radius:50%; border:2px solid #D9B873; animation:ripple 1.1s ease-out .55s both; } @keyframes stamp{ 0%{ transform:scale(3.2) rotate(-40deg); opacity:0; } 60%{ transform:scale(.85) rotate(6deg); opacity:1; } 100%{ transform:none; opacity:1; } } @keyframes ripple{ from{ transform:scale(1); opacity:.9; } to{ transform:scale(4.2); opacity:0; } } :where([data-page="verifica"]) .res--anim .thumb img{ animation:imgIn .9s ease .35s both; } @keyframes imgIn{ from{ opacity:0; filter:blur(10px); transform:scale(1.15); } to{ opacity:1; filter:none; transform:none; } } :where([data-page="verifica"]) .res--anim h3{ animation:titleIn .7s cubic-bezier(.2,.8,.2,1) .45s both; } @keyframes titleIn{ from{ opacity:0; letter-spacing:.14em; transform:translateX(-10px); } to{ opacity:1; letter-spacing:normal; transform:none; } } :where([data-page="verifica"]) .res--anim .meta tr{ animation:rowIn .5s ease both; } :where([data-page="verifica"]) .res--anim .meta tr:nth-child(1){ animation-delay:.65s; } :where([data-page="verifica"]) .res--anim .meta tr:nth-child(2){ animation-delay:.73s; } :where([data-page="verifica"]) .res--anim .meta tr:nth-child(3){ animation-delay:.81s; } :where([data-page="verifica"]) .res--anim .meta tr:nth-child(4){ animation-delay:.89s; } :where([data-page="verifica"]) .res--anim .meta tr:nth-child(5){ animation-delay:.97s; } @keyframes rowIn{ from{ opacity:0; transform:translateX(-14px); } to{ opacity:1; transform:none; } } :where([data-page="verifica"]) .res.res--anim.no{ animation:cardIn .5s ease both, shakeNo .5s ease .45s; } @keyframes shakeNo{ 0%,100%{ transform:none; } 20%{ transform:translateX(-7px); } 40%{ transform:translateX(6px); } 60%{ transform:translateX(-4px); } 80%{ transform:translateX(3px); } } @media(prefers-reduced-motion:reduce){ :where([data-page="verifica"]) .scan__ring svg,:where([data-page="verifica"]) .scan__ring i,:where([data-page="verifica"]) .res--anim,:where([data-page="verifica"]) .res--anim *,:where([data-page="verifica"]) .res--anim *::after{ animation:none!important; } } /* footer ca în restul site-ului */ :where([data-page="verifica"]) .verify footer.sitefoot{ display:block!important; background:var(--panel)!important; border-top:0!important; margin-top:52px; padding:54px 0 calc(40px + env(safe-area-inset-bottom,0px))!important; font-family:inherit; font-style:normal; font-size:inherit; letter-spacing:normal; color:var(--panel-ink); text-align:center; } :where([data-page="verifica"]) .verify .sitefoot .foot{ display:flex; flex-direction:column; align-items:center; text-align:center; gap:18px; } :where([data-page="verifica"]) .verify .sitefoot .foot .brand{ position:relative; display:block; line-height:0; } :where([data-page="verifica"]) .verify .sitefoot .foot .brand img{ height:54px; width:auto; opacity:0; } :where([data-page="verifica"]) .verify .sitefoot small{ color:#8f897c; font-size:13px; font-style:normal; } :where([data-page="verifica"]) .verify .sitefoot .foot__links{ display:flex; gap:10px 26px; flex-wrap:wrap; justify-content:center; font-size:13.5px; } :where([data-page="verifica"]) .verify .sitefoot .foot__links a{ color:#b9b3a4; } :where([data-page="verifica"]) .verify .sitefoot .foot__links a:hover{ color:var(--gilt-soft); } :where([data-page="verifica"]) .verify .sitefoot .foot__social{ display:flex; flex-wrap:wrap; justify-content:center; gap:12px; } :where([data-page="verifica"]) .verify .sitefoot .foot__social a{ display:inline-flex; align-items:center; gap:9px; text-decoration:none; color:var(--panel-ink); border:1px solid rgba(232,226,214,.2); padding:8px 14px; } :where([data-page="verifica"]) .verify .sitefoot .foot__social svg{ width:20px; height:20px; color:var(--gilt-soft); flex:none; } :where([data-page="verifica"]) .verify .sitefoot .foot__social span{ display:flex; flex-direction:column; line-height:1.25; text-align:left; } :where([data-page="verifica"]) .verify .sitefoot .foot__social b{ font-weight:500; font-size:13.5px; } :where([data-page="verifica"]) .verify .sitefoot .foot__social small{ font-size:11px; color:#b9b3a4; } :where([data-page="verifica"]) .verify .sitefoot [data-ro]{ display:inline; } :where([data-page="verifica"]) .verify .sitefoot a[data-ro]{ display:inline-block; } :where([data-page="verifica"]) .verify .sitefoot [data-en]{ display:none!important; } html[lang=en]:where([data-page="verifica"]) .verify .sitefoot [data-ro]{ display:none!important; } html[lang=en]:where([data-page="verifica"]) .verify .sitefoot [data-en]{ display:inline!important; } html[lang=en]:where([data-page="verifica"]) .verify .sitefoot a[data-en]{ display:inline-block!important; } /* verifica: aliniere stânga, text explicativ cât lățimea chenarului */ :where([data-page="verifica"]) .verify .mark--logo{ position:relative; display:block; line-height:0; justify-self:center; } :where([data-page="verifica"]) .verify .mark--logo img{ height:44px; width:auto; opacity:0; display:block; } :where([data-page="verifica"]) .verify .mark--logo::after{ content:""; position:absolute; inset:0; background:#D8C08C; -webkit-mask:url(logo-alb.png) center/contain no-repeat; mask:url(logo-alb.png) center/contain no-repeat; } @media(max-width:480px){ :where([data-page="verifica"]) .verify .mark--logo img{ height:38px; } } :where([data-page="verifica"]) .verify main,:where([data-page="verifica"]) .verify .panel,:where([data-page="verifica"]) .verify .res{ text-align:left; } :where([data-page="verifica"]) .verify .note{ text-align:center; } :where([data-page="verifica"]) .verify .eyebrow{ justify-content:flex-start; } :where([data-page="verifica"]) .verify .lede{ max-width:none; margin-left:0; margin-right:0; } @media(max-width:480px){ :where([data-page="verifica"]) .verify .bar{ display:flex!important; justify-content:space-between; gap:8px; } :where([data-page="verifica"]) .verify .bar__sp{ display:none; } :where([data-page="verifica"]) .verify .mark{ font-size:17px; text-align:left; } :where([data-page="verifica"]) .verify .mark small{ font-size:9px; letter-spacing:1.4px; } :where([data-page="verifica"]) .verify .lang{ margin-left:auto; } } /* ════════════════════════════════════════════════════════════════ MENIU PE TOT ECRANUL (butonul cu 3 linii) — construit de site.js Înlocuiește linkurile din bara de sus, pe toate ecranele. ════════════════════════════════════════════════════════════════ */ /* bara de sus: [3 linii] — logo pe centru — [buton comandă + limbă] */ .nav .nav__inner{ display:grid!important; grid-template-columns:1fr auto 1fr!important; align-items:center; column-gap:20px!important; } .nav .nav__links,.nav .nav__toggle{ display:none!important; } .nav .brand{ grid-column:2!important; grid-row:1; justify-self:center!important; } .nav .nav__end{ grid-column:1; grid-row:1; justify-self:start; display:flex; align-items:center; } .nav .nav__right{ grid-column:3!important; grid-row:1; justify-self:end!important; } @media(max-width:900px){ .nav .nav__right{ display:flex!important; } .nav .nav__right .nav__cta{ display:none!important; } } /* butonul cu 3 linii: sus și jos lungi, mijlocul scurt (aliniat la dreapta) */ .mm-btn{ position:relative; width:44px; height:44px; border:0; background:none; cursor:pointer; color:#D8C08C; padding:0; -webkit-tap-highlight-color:transparent; } .mm-btn i{ position:absolute; left:9px; top:50%; height:1.5px; margin-top:-.75px; background:currentColor; border-radius:2px; transition:width .5s cubic-bezier(.65,0,.35,1), transform .5s cubic-bezier(.65,0,.35,1), opacity .3s ease; } .mm-btn i:nth-child(1){ width:30px; transform:translate(0,-6px); } .mm-btn i:nth-child(2){ width:17px; transform:translate(13px,0); } .mm-btn i:nth-child(3){ width:30px; transform:translate(0,6px); } .mm-btn:focus-visible{ outline:1px solid rgba(216,192,140,.6); outline-offset:2px; } /* la trecere: liniile de sus și de jos se scurtează de la dreapta spre stânga (capătul stâng rămâne pe loc), până ajung exact unde începe linia din mijloc; mijlocul nu se mișcă */ @media(hover:hover){ .mm-btn:hover i:nth-child(1),.mm-btn:hover i:nth-child(3){ width:13px; } } /* deschis: liniile se adună într-una singură */ html.mm-open .mm-btn i:nth-child(1),html.mm-open .mm-btn i:nth-child(3){ width:0; opacity:0; transform:none; } html.mm-open .mm-btn i:nth-child(2){ width:30px; transform:none; } /* stratul pe tot ecranul */ html.mm-open{ overflow:hidden!important; } html.mm-open .nav{ z-index:1001!important; background:transparent!important; border-bottom-color:transparent!important; box-shadow:none!important; } html.mm-open .nav .nav__right .nav__cta{ visibility:hidden; } .mm{ position:fixed; inset:0; z-index:1000; color:#EDE9DF; visibility:hidden; opacity:0; transition:opacity .6s ease, visibility 0s linear .6s; overflow:hidden; } html.mm-open .mm{ visibility:visible; opacity:1; transition:opacity .6s ease; } .mm__bg{ position:absolute; inset:-40px; background:url(footer-repin.jpg) center/cover no-repeat; filter:blur(14px) saturate(.7); transform:scale(1.08); transition:transform 1.4s cubic-bezier(.2,.7,.2,1); } html.mm-open .mm__bg{ transform:scale(1); } .mm::before{ content:""; position:absolute; inset:0; z-index:1; background:radial-gradient(120% 90% at 50% 45%, rgba(40,41,36,.86), rgba(24,25,22,.96)); } .mm__inner{ position:relative; z-index:2; height:100%; display:flex; flex-direction:column; justify-content:center; padding:96px 0 60px; } /* titlurile mari, pe un rând care alunecă */ .mm__track{ display:flex; align-items:baseline; gap:clamp(30px,5vw,90px); white-space:nowrap; will-change:transform; transition:transform .9s cubic-bezier(.65,0,.25,1); } .mm__title{ font-family:var(--ff-display); font-weight:400; font-size:clamp(58px,13vw,210px); line-height:1; letter-spacing:-.01em; color:rgba(216,192,140,.2); background:none; border:0; padding:0; cursor:pointer; transition:color .7s ease, text-shadow .7s ease; } .mm__title{ position:relative; text-decoration:none; display:inline-block; } .mm__title.is-on{ color:#D8C08C; text-shadow:0 0 40px rgba(216,192,140,.18); cursor:pointer; } /* titlul activ arată ca un link: textul se luminează la hover */ .mm__title.is-on:hover,.mm__title.is-on:focus-visible{ color:#F0DDB0; text-shadow:0 0 22px rgba(251,239,203,.45), 0 0 60px rgba(216,192,140,.3); outline:none; } .mm__title:not(.is-on):hover{ color:rgba(216,192,140,.38); } /* sublinkurile, care apar în cascadă */ .mm__body{ position:relative; width:min(980px,calc(100% - 2*clamp(20px,5vw,64px))); margin:clamp(20px,3.5vw,44px) auto 0; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,2.2fr); gap:20px; min-height:clamp(170px,26vh,260px); } .mm__list{ list-style:none; margin:0; padding:0; } .mm__list li{ opacity:0; transform:translateY(-16px); transition:opacity .55s ease, transform .55s cubic-bezier(.2,.7,.2,1); transition-delay:calc(var(--i,0) * 70ms + 150ms); } .mm__list a{ display:inline-block; font-family:var(--ff-display); font-size:clamp(22px,2.4vw,32px); line-height:1.5; color:#EDE9DF; transition:color .3s ease, text-shadow .3s ease, transform .3s ease; } .mm__list a:hover,.mm__list a:focus-visible{ color:#D8C08C; text-shadow:0 0 14px rgba(251,239,203,.35); transform:translateX(6px); outline:none; } .mm.is-shown .mm__list li{ opacity:1; transform:none; } /* jos: indicator + rețele */ .mm__foot{ position:absolute; left:0; right:0; bottom:22px; z-index:2; display:flex; justify-content:space-between; align-items:center; gap:16px; padding:0 clamp(20px,4vw,48px); font-family:var(--ff-mono); font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:rgba(237,233,223,.55); } .mm__dots{ display:flex; gap:10px; } .mm__dots button{ width:26px; height:14px; border:0; padding:0; background:none; cursor:pointer; position:relative; } .mm__dots button::after{ content:""; position:absolute; left:0; right:0; top:50%; height:1px; background:rgba(237,233,223,.3); transition:background .4s ease, height .4s ease; } .mm__dots button.is-on::after{ background:#D8C08C; height:2px; } .mm__social{ display:flex; gap:18px; } .mm__social a{ color:rgba(237,233,223,.6); transition:color .3s; } .mm__social a:hover{ color:#D8C08C; } .mm__hint{ position:absolute; left:50%; transform:translateX(-50%); white-space:nowrap; } @media(max-width:700px){ .mm__inner{ padding:84px 0 70px; justify-content:flex-start; padding-top:clamp(110px,22vh,180px); } /* blocul de linkuri stă spre centru, dar textul pornește aliniat la stânga */ .mm__body{ grid-template-columns:1fr; gap:6px; width:auto; margin-left:clamp(40px,20vw,120px); margin-right:20px; justify-items:start; text-align:left; } .mm__list a:hover,.mm__list a:focus-visible{ transform:none; } .mm__list a{ font-size:24px; line-height:1.6; } .mm__list li{ transition-duration:.4s; transition-delay:calc(var(--i,0) * 40ms + 60ms); } .mm__track{ transition-duration:.45s; } .mm__hint{ display:none; } .mm__social{ gap:14px; } } @media(prefers-reduced-motion:reduce){ .mm,.mm__bg,.mm__track,.mm__title,.mm__list li,.mm-btn i{ transition:none!important; } } /* ════════════════════════════════════════════════════════════════ COMANDĂ: pașii „Cum lucrăm împreună” pe 4 coloane, cu cifre romane mari, conturate, și titluri în auriul logoului ════════════════════════════════════════════════════════════════ */ :where([data-page="comanda"]) .commissions .steps{ gap:clamp(18px,2.6vw,40px); margin-top:clamp(10px,2vw,24px); } :where([data-page="comanda"]) .commissions .step{ position:relative; padding-top:clamp(70px,7vw,104px); } :where([data-page="comanda"]) .commissions .step__n{ position:absolute; top:0; left:-4px; z-index:0; font-family:var(--ff-display); font-style:normal; font-size:clamp(96px,10vw,150px); line-height:1; letter-spacing:0; color:transparent; -webkit-text-stroke:1.2px rgba(217,184,115,.38); pointer-events:none; user-select:none; transition:-webkit-text-stroke-color .35s ease; } :where([data-page="comanda"]) .commissions .step:hover .step__n{ color:transparent; -webkit-text-stroke-color:rgba(217,184,115,.6); } :where([data-page="comanda"]) .commissions .step h3{ position:relative; z-index:1; color:#D8C08C; font-size:clamp(22px,2vw,28px); border-top:0; padding-top:0; margin:0 0 10px; } :where([data-page="comanda"]) .commissions .step p{ position:relative; z-index:1; } :where([data-page="comanda"]) .lead-note{ color:#DAD6CA; } @media(max-width:700px){ :where([data-page="comanda"]) .commissions .steps{ grid-template-columns:1fr; gap:22px; } :where([data-page="comanda"]) .commissions .step{ padding-top:64px; } :where([data-page="comanda"]) .commissions .step__n{ font-size:96px; } } /* lista de prețuri: primul cuvânt al notei (ex. „Retușuri:”) în auriul site-ului */ :where([data-page="preturi"]) .pr .pnote__k{ color:#D8C08C; font-weight:400; letter-spacing:.06em; text-transform:uppercase; } /* lista de prețuri: exemplul de „portret simplu” lângă introducere */ :where([data-page="preturi"]) .pr .pr-head{ position:relative; padding-right:clamp(0px,24vw,300px); } :where([data-page="preturi"]) .pr .pr-ex{ position:absolute; right:0; top:0; width:clamp(150px,17vw,220px); margin:0; } :where([data-page="preturi"]) .pr .pr-ex img{ width:100%; height:auto; display:block; box-shadow:0 18px 40px -22px rgba(0,0,0,.7); } :where([data-page="preturi"]) .pr .pr-ex figcaption{ margin-top:10px; font-family:var(--ff-mono); font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:#D8C08C; line-height:1.5; } :where([data-page="preturi"]) .pr .pr-ex figcaption i{ display:block; font-family:var(--ff-display); font-size:15px; letter-spacing:0; text-transform:none; color:#d9d5c8; } @media(max-width:700px){ :where([data-page="preturi"]) .pr .pr-head{ padding-right:0; } :where([data-page="preturi"]) .pr .pr-ex{ position:static; width:170px; margin-top:22px; } } /* formulare: căsuța de acord cu politica de confidențialitate mai aproape de câmpul de deasupra */ #contactForm .consent,#orderForm .consent{ margin-top:-8px!important; } /* portofoliu: textul de sub fiecare lucrare puțin mai jos (era lipit de ramă — span-ul nu primea margine) */ .pf .pfc__cap{ display:block; margin-top:10px!important; } .pf .pfc__cap b{ margin-bottom:4px; } /* protecție imagini: fără meniul „Salvează imaginea” la apăsare lungă pe telefon și fără tragere */ img{ -webkit-touch-callout:none; -webkit-user-drag:none; user-drag:none; -webkit-user-select:none; user-select:none; } /* ───────── LIGHTBOX: X centrat, bulină aliniată, săgeți fixe jos pe telefon ───────── */ .lb__close{ font-size:0!important; line-height:0; text-indent:0; } .lb__close::before,.lb__close::after{ content:""; position:absolute; left:50%; top:50%; width:18px; height:1.5px; margin:-.75px 0 0 -9px; background:currentColor; border-radius:1px; transform:rotate(45deg); } .lb__close::after{ transform:rotate(-45deg); } /* casuta de stare: bulina stă pe linia textului (nu depinde de metrica fontului); spațierea literelor lasă un gol în dreapta, îl compensăm în padding */ .lb__badge{ display:inline-block; line-height:1.2; padding:6.5px 17px 9.5px 19px; text-align:center; white-space:nowrap; } .lb__badge::before{ display:inline-block; width:8px; height:8px; margin-right:10px; vertical-align:baseline; } @media(max-width:820px){ .lb{ padding:70px 16px 96px!important; } .lb__close{ top:16px!important; right:16px!important; width:46px; height:46px; } /* săgețile rămân mereu pe ecran, jos, la mijloc (nu depind de înălțimea paginii) */ .lb__nav{ position:fixed!important; top:auto!important; bottom:max(18px,calc(env(safe-area-inset-bottom) + 10px)); transform:none!important; width:48px; height:48px; background:rgba(18,22,18,.9); z-index:5; } .lb__nav:hover,.lb__nav:active{ transform:none!important; } .lb__nav--prev{ left:calc(50% - 56px)!important; right:auto!important; } .lb__nav--next{ left:calc(50% + 8px)!important; right:auto!important; } .lb img{ max-height:max(190px,calc(100vh - 440px))!important; max-height:max(190px,calc(100dvh - 440px))!important; } .lb__status{ margin-bottom:12px!important; min-height:0!important; } .lb__cap{ margin-top:14px!important; font-size:24px!important; } .lb__cap small{ font-size:15px!important; line-height:1.4; margin-top:6px!important; } .lb__pricebox{ margin-top:12px!important; } .lb__pricebox .lb__price{ padding:6px 18px; font-size:24px; } .lb__action{ margin-top:16px!important; gap:10px!important; } .lb__action button.btn{ padding:14px 22px; font-size:16px; letter-spacing:.1em; white-space:nowrap; } .lb__action .lb__sold{ display:none; } } /* meniu deschis: pagina de sub el nu se mișcă pe orizontală (swipe, „înapoi” din aplicații) */ html.mm-open,html.mm-open body{ overscroll-behavior:none; touch-action:pan-y; } /* (fără overflow pe body: ar face bara de sus să rămână în urmă când meniul e deschis după derulare) */ .mm{ touch-action:pan-y; overscroll-behavior:none; } /* ════════════════════════════════════════════════════════════════ COMANDĂ: pasul I (formularul) în prim-plan, înaintea celorlalți pași ════════════════════════════════════════════════════════════════ */ :where([data-page="comanda"]) #formular{ scroll-margin-top:84px; } :where([data-page="comanda"]) .order-start{ display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,1fr); gap:clamp(26px,4.5vw,72px); align-items:start; padding:0 0 clamp(36px,5vw,60px); margin:clamp(10px,2vw,24px) 0 clamp(36px,5vw,60px); border-bottom:1px solid var(--line-dark); } :where([data-page="comanda"]) .order-start__step{ font-family:var(--ff-mono); font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:var(--gilt-soft); margin:0 0 14px; } :where([data-page="comanda"]) .order-start h3{ font-family:var(--ff-display); font-weight:400; color:#D8C08C; font-size:clamp(28px,3.2vw,42px); line-height:1.1; margin:0 0 16px; } :where([data-page="comanda"]) .order-start p{ color:#DAD6CA; font-size:16.5px; line-height:1.6; margin:0 0 22px; } :where([data-page="comanda"]) .order-start .order-start__step{ font-size:12px; color:var(--gilt-soft); margin:0 0 14px; } :where([data-page="comanda"]) .order-start .order-start__alt{ font-size:14.5px; color:#AAA496; margin:18px 0 0; } :where([data-page="comanda"]) .order-start .order-start__lead{ font-family:var(--ff-mono); font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--gilt-soft); margin:0 0 16px; padding-bottom:12px; border-bottom:1px solid var(--line-dark); } :where([data-page="comanda"]) .order-start ul{ list-style:none; margin:0; padding:0; display:grid; gap:16px; } :where([data-page="comanda"]) .order-start li{ display:grid; grid-template-columns:18px 1fr; gap:12px; font-size:15.5px; line-height:1.55; color:#DAD6CA; } :where([data-page="comanda"]) .order-start li::before{ content:""; width:7px; height:7px; margin-top:8px; border:1px solid var(--gilt-soft); transform:rotate(45deg); } :where([data-page="comanda"]) .order-start li b{ color:#D8C08C; font-weight:500; } /* cifra I mare, conturată, la fel ca II–V de sub chenar */ :where([data-page="comanda"]) .order-start__main{ position:relative; padding-top:clamp(70px,7vw,104px); } :where([data-page="comanda"]) .order-start__n{ position:absolute; top:0; left:-4px; z-index:0; font-family:var(--ff-display); font-style:normal; font-size:clamp(96px,10vw,150px); line-height:1; letter-spacing:0; color:transparent; -webkit-text-stroke:1.2px rgba(217,184,115,.38); pointer-events:none; user-select:none; } :where([data-page="comanda"]) .order-start__main h3{ position:relative; z-index:1; } :where([data-page="comanda"]) .order-start__main + div{ padding-top:clamp(70px,7vw,104px); } @media(max-width:800px){ :where([data-page="comanda"]) .order-start{ grid-template-columns:1fr; } :where([data-page="comanda"]) .order-start__main{ padding-top:64px; } :where([data-page="comanda"]) .order-start__n{ font-size:96px; } :where([data-page="comanda"]) .order-start__main + div{ padding-top:0; } } /* COMANDĂ: spațiu între paragrafele dintr-un pas și sub rândul de pași */ :where([data-page="comanda"]) .commissions .step p + p{ margin-top:12px; } :where([data-page="comanda"]) .commissions .steps{ margin-bottom:clamp(36px,5vw,56px); } /* COMANDĂ: trei pași (II–IV) pe trei coloane */ [data-page="comanda"] .commissions .steps--3{ grid-template-columns:repeat(3,1fr); } @media(max-width:800px){ [data-page="comanda"] .commissions .steps--3{ grid-template-columns:1fr; } } /* DESPRE: prima literă (D / A) este o inițială mare, aurie, din text (font), fără vectorul ornamental */ html[lang] .about__body p.lead + p::before{ content:none; display:none; width:0; height:0; margin:0; background:none; } html[lang] .about__body p.lead + p::first-letter{ float:left; font-family:var(--ff-display); font-weight:400; font-size:92px; line-height:.78; padding:10px 14px 0 0; color:#D9B873; }